Hi, I am a webflow user. I am looking for CSS code that can KEEP ALL ELEMENTS POSITIONED in the SAME spot across all resolutions

Oct 27, 2023
Reaction score
i've been a long-term user of Webflow; although I hadn't designed a whole lot until now.

Well, I am coming across a LOT of issues; primarily the situation where Webflow's responsiveness-system automatically scales; or rather moves elements when you change the resolution based on how much the original breakpoint is stretched smaller/larger from where it is originally placed on (x) resolution via (x) breakpoint. I've found a solution that was makeshift, I somehow got the center column of a grid to keep all elements in the same position.

But it wasn't absolute (Just like absolute positioning); although (x) elements were placed in the same column with the same width setting; every setting being the same, there would be some that would move positions and some that would stay the same. Initially, they were all stabally staying the same. I have tried every single width setting/other settings on BOTH the grid and individual elements, vice-versa.

Since then, I have not been able to replicate this, despite using the same preset on a dummy grid; and using standalone elements/containers, it doesn't function the same either. Even with the same settings I set on the grid; having set on the elements.

More so even, the 'preview' is not accurate to the published version 100% of the time.

Sometimes, elements are positioned in random spots which change differently when I re-position the element's original position.


Proof of my claim AND proof my site IS stable, and my practices ARE good: https://drive.google.com/file/d/1Lya-fi2MaLEE22Q3IWA9gB-7LHirHRAX/view?usp=sharing

Proof that the columns are the same presets: https://drive.google.com/file/d/14qGXd2AihZENUSgiJAiiGEcFwYlZ3XjN/view?usp=sharing

/ Please watch this video: https://drive.google.com/file/d/1nPRE8hj2VZoCNP7OJQQJLgs_YFAYDnRL/view?usp=sharing


๐—”๐˜€ ๐˜๐—ต๐—ฒ ๐˜๐—ถ๐˜๐—น๐—ฒ ๐˜€๐˜๐—ฎ๐˜๐—ฒ๐˜€; ๐—œ ๐—ฎ๐—บ ๐—น๐—ผ๐—ผ๐—ธ๐—ถ๐—ป๐—ด ๐—ณ๐—ผ๐—ฟ ๐—ฐ๐—ผ๐—ฑ๐—ฒ ๐˜๐—ต๐—ฎ๐˜ ๐—ฐ๐—ฎ๐—ป ๐—ณ๐—ถ๐˜… ๐—”๐—Ÿ๐—Ÿ ๐—ฒ๐—น๐—ฒ๐—บ๐—ฒ๐—ป๐˜๐˜€ ๐—ฒ๐˜…๐—ฎ๐—ฐ๐˜๐—น๐˜† ๐˜„๐—ต๐—ฒ๐—ฟ๐—ฒ ๐˜๐—ต๐—ฒ๐˜† ๐—ฎ๐—ฟ๐—ฒ ๐—ถ๐—ป ๐˜๐—ต๐—ฒ ๐—ฒ๐—ฑ๐—ถ๐˜๐—ผ๐—ฟ ๐—ฎ๐—ฐ๐—ฟ๐—ผ๐˜€๐˜€ ๐—ฏ๐—ผ๐˜๐—ต ๐˜๐—ต๐—ฒ ๐—ฝ๐—ฟ๐—ฒ๐˜ƒ๐—ถ๐—ฒ๐˜„/๐—ฝ๐˜‚๐—ฏ๐—น๐—ถ๐˜€๐—ต๐—ฒ๐—ฑ ๐—ฟ๐—ฒ๐˜€๐—ผ๐—น๐˜‚๐˜๐—ถ๐—ผ๐—ป๐˜€.

I found this URL that may be helpful; https://stackoverflow.com/questions...me-position-at-different-resolutions#52265716 ; but I tried using the code to no avail. I may be using it wrong.

Also; this code appears to only affect 1 single element. And when I type in the specific element class-name (such as div block 4); it doesn't do anything.

How do I go about that? And is there any code that exists which I can throw into my page's CSS block which makes the position of all elements completely absolute (Stay in the same spot cross-resolution)......?

Here is a read-only link: https://preview.webflow.com/preview...eId=653b941a5b170543920e63e7&workflow=preview

I tried almost every setting I could on an element-basis. Nothing worked to keep the position the same except the magic I came across the center column in my parent grid. Can't seem to replicate it using the same settings on grid/elements as I mentioned.

(These are all the same issue, it is focused on 1 topic/subject)

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

No members online now.

Forum statistics

Latest member

Latest Threads