Streaming live at 10am (PST)

Tabs dont behave the same after exporting project

So I have multiple pages with tabs that are set to have a 25% width. In webflow, my 4 tabs take up the entirety of their parent container and behave exactly as expected.

However, when I export the code AND MAKE ABSOLUTELY NO CHANGES BY HAND, the fourth tab breaks to a new line on each page that contains my tabs. I don’t understand why this is happening.

Heres a photo of whats happening

This consistently happens across all pages with tabs and in all browsers. I’ve never had an issue with webflow behaving differently in the editor than when its exported so I’m pretty confused.

Here is my public share link: link
(how to access public share link)

So i fixed this issue by setting a font size of 0 on the the class of w-clearfix in my webflow.css file

Still not sure why it happened or if this is a good fix but I’m going with it for now.

.w-clearfix{ font-size:0; }

I am pretty sure that there’s a webflow only solution for this, but I can’t find it back. @cyberdave do you know?

That’s cool. I’ve done very little editing to source code so far so I wouldn’t mind fixing this in webflow and re-writing my code. Thanks for the reply. I hope it gets figured out so I can avoid this in the future

@steelesong Have yo tried minifying export?

Try following this guide:

So this did work, but isn’t really an option for me. I picked webflow because the code it exports is easy to modify. I HAVE to be able to add my own code.

You can add your own code. Here are two articles that may help:

Hope this helps :slight_smile:

unfortunately it doesn’t. I write C# code. I convert all my pages to an aspx format.

I’ll stick with setting the font-size of the parent container to zero and then setting the font-size of the text inside it with an additional class.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.