Under the russian version of my homepage I have a four column row for the Desktop view and for the tablet and phone (landscape) versions I selected a two column row but Webflow isn’t handling correctly the layout. Here’s a screenshot of what I get (I’m not able to clear it because it says that Webflow handles it by itself).
http://www.delabridge.com/screenshots/home-russian_clearfix.jpg
Any ideas?
Hi @adlpp,
It probably happens because of different height for columns. Try to give them same height size and it could help.
Regards,
Anna
Thank you @sabanna, it did helped but why I needed it set a height if it shouldn’t be necessary? I mean, my other pages on different languages didn’t need it to. Shouldn’t Webflow automatically set a clearfix when I change from 4 to 2 (and others)?
As you probably noticed all elements in Webflow already has its own “predefined” classes which you can’t see in designer mode, but which help you recognise the type of elements (row, column, container etc.) all columns has class w-column and has style float: left. As I can assume you also know how mediaquerry works. So, if for particular screen size they will put option clear: left and float left to columns class, then all columns will stack on top of each other, which is not what you need.
That is why they are using combination of display: inline-block + float: left + fixed width (different for different screens)
And here is appear a little issue: if columns have a height= auto, there is a chance that they can “prevent” other elements floating
If you still prefer to use clear option, I would suggest to create “dummy div” and give it class same as you have for columns. All style changes that you will apply on that div will be reflected on columns style. After got result that you want "dummy div " can be removed.
Regards,
Anna
Thank you for your great answer.
Always welcome 
Glad I could help
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.
