Popover styling

Ionic Framework ionic-v3
3

Hey Angelo, two ways.

  1. override the SCSS variables;

$popover-md-width: 320px; $popover-ios-width: 320px; $popover-wp-width: 320px;

or 2. give your popover a class:

let popover = this.popover.create(ContactPopover, {}, {cssClass: 'contact-popover'})

and then style the .popover-content:

.contact-popover .popover-content{ width: 320px; }

Ionic automatically calculates the correct position for your custom width popover.

15 Likes