Override the toolbar-ios class


I need to get rid of the padding: 0 90px 1px property that gets applied to the ion-title element for ios. My windows and Android header looks fine but for ios because of the 90px padding on the right causes my text to get truncated. How can i override this in ionic2?

toolbar-ios ion-title {
position: absolute;
top: 0;
left: 0;
padding: 0 90px 1px;
width: 100%;
height: 100%;
-webkit-transform: translateZ(0);
transform: translateZ(0);
pointer-events: none;


This gets calculated on the fly as titles are animated in and out of the view.

I wouldn’t try to modify this as it could lead to more issues down the road


Is it possible to get a little more detail here? I’m running into a similar issue and my ion-title elements on iOS don’t seem to recalculate their padding even if the title is somewhat wide. Currently it has space for ~16 characters on the iPhone 5 form factor (320x568) at 16px (1.6rem).