Tabs Text in Portrait View - Does not align center

While working with 3 tabs and transitioning from Desktop > Tablet > Landscape the text that is centered within the tabs looks great (followed step by step tab tutorial). But when in portrait mode - text no longer aligns center due to the length of the text.

I have attempted to make individual adjustments by creating a class and using relative positioning. The problem - the only dimension it looks correct on in portrait is the preview mode at 479px.

Can anything be done to simply center and not have to adjust manually or do I bite the bullet on this one?

Thanks in advance,
Sean

Can you please share your project’s public link so it’s easier to understand your issue?

Learn how to do it here: Share a read-only link | Webflow University

https://webflow.com/design/inversoft?preview=0ad2bd41ccaff4e8cf4ad216680ff737

You will need to go to “products” > “cleanspeak” > and scroll down to features. There you will find the issue with the tabs in portrait mode. Keep in mind, the text “Moderator and Reporting” because it’s longer than “Filter” is where the issue lies.

Vincent,

Below you will find a link to the page in which you will find 3 tabs named filter, moderation and reporting. If you view †this page on a mobile device you will see that the text is off centered. It does not do this in desktop, tablet, and mobile landscape mode.

View this on your mobile device > http://inversoft.webflow.com/products/cleanspeak-profanity-filter-moderation-software

Currently viewing it on an iPhone 6 on Safari and Chrome.

Sean

The text isn’t off centered. It’s just too long for the room left for it.

Look at this:

The button first applies the paddings, after that it leaves just enough room to write “Filters”. all the rest goes off centered.

So while on this device view in the designer, reduce the paddings and/or text size.

Mofifying a property for a device ONLY AFFECT THE CURRENT DEVICES AND THE DEVICES BELOW. So by doing modifications on the last device you’re sure it’s not going to change anything for the others.

1 Like

Thanks Vince - That’s what I needed.

1 Like