I have been designing in Webflow for nearly a year now, and for the most part, i’m really enjoying my experience so far. However, there are a few different niggles I have, and this particular one, rears its ugly head every now and again. When in edit mode, I position elements exactly where I would want them to be on the actual live website. However, every now and then, there are some elements that miss behave and change their position in preview mode, forcing me to essentially edit in the dark. I have started a topic about this in the past, and received some great help, and I have come a long way in Webflow since that time, but this problem still exists for me.
Let me give you some examples.
Recently I have been remaking the Nvidia GTX 1070 website in Webflow. Most of the site has been going well so far, but let me share some of the positioning problems I have. The first problem I came across was that I had to position the Mirrors Edge, Dice, and EA logos just slightly out of the section (now affecting elements below) just to get them to sit in the place I wanted them to be (inside the section).
Logos out of section
So they can sit in the section in preview mode
I was building three columns of content, all the same apart from different text and pictures, but all positioned in the same place. If you look at the second column, you will see that the column header is taking up one more line than the headers in the two other columns, now forcing the content beneath to be lower than the content in columns 1 and 3. All I care for is that the buttons in the three columns are aligned and level with each other, and I managed to achieve this, as you can see in the pic below.
However, when in preview mode, it still seems as though the extra line of text is still forcing the 2nd column button to be lower than the buttons in columns 1 and 3. Why? Because I have already changed the position of the button in edit mode to line back up (or near enough) with the other two buttons.
I don’t know why Webflow haven’t really got round to redesigning this aspect of their platform yet? Similar companies have this aspect sorted. Where you position elements in edit mode, that’s exactly where they’ll be in preview mode, but not for Webflow (well at least not for me anyway). Please don’t tell me to use one of those other companies, because Webflow still has far more advantages over the competition, and a very strong, helpful and beautiful community. I will be extremely grateful for any help anyone can give me! I’ve seen other people create beautiful websites on this platform, and I know that I can do it too.