Streaming live at 10am (PST)

Site layout styles rendering differently in Preview than on Published site


Good Afternoon,

I've run into a little problem testing out the editor.

Below are two screenshots of how my website appears when published and while designing;

This 3rd one is how the site appears in the editor, divs completely loose their height and are their positioning goes out the window.

I've had a play around with the way elements float and appear but nothings worked so far, here's hoping someone else has run into this problem before and knows of a solution?



Hi @Qwen

Thanks for posting about this. Can you please share your Read-Only link :slight_smile:


Sure thing...



It looks like you are using flexbox quite a bit to achieve the layout you have. Are you by chance using safari to check the live site?

You can fix this by changing the flex child settings to expand:

Hope this helps!


Yeah I'm using Safari, the problem also occurs on the home page which doesn't have any flex boxes.


I was unable to reproduce this behavior. However I noticed you have both the body and the div with the w bg image set to 100% height.

I recommend setting the body back to default height (alt + click the blue) then setting the element Div Block to width: 100vw and height: 100vh

It may be collapsing because there is no content within that div. Setting to 100vw and vh will ensure it stays full width and height.

Hope this helps!


Okay, I'll give that a go now.

Thanks for the help @Brando, appreciate it!

closed #8

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