I’ve been working on constructing a very simple website and I had a column of white space on the published site. I have removed all the fixed width for divs which fixed the problemt, but after some more working on the site being done, it appeared again and I can’t figure why. As long as I can see, I can’t find any hidden overflow or fixed-width value. If someone could look through the link and lend a little help I’d greatly appreciate it
Here is my site Read-Only: Webflow - Viki's Blank Site
Hi Viki,
If you use CSS grid I think it will help what you want to do. Grid is great for creating layouts for pages. like this and it is responsive.
here is the very helpful webflow university as well
hi thank you for the suggestion, but would there be a way to get rid of this white space without adding a grid?
you need some sort of container for the two parts of your page. two divs. you can create them and give them a percentage if you rather. you can give grid columns percentages as well. But the design has to be responsive and fixed widths and margins used like that prevent responsive design. I think the odd white space is because you are using margins incorrectly. What is your hesitation with Css grid?
thank you for the follow up, I tried using the grids after the tutorial, I tried dragging my dividers into the cells and they simply don’t go in nor wrap around. I tried different ways and can’t figure out how. I found it quite frustrating and unintuitive ;/ Is there no simple way of fixing this? cause previously I only had to get rid of all fixed width and this white space was gone. And afterwards all I did was changing background images and duplicating divs and for some reason this white gap appeard again which is really driving me mad!
Viki. You have to create one big box. A div. Then you have to put other boxes - two divs inside of it. One is your left content and the other your right content. You can give these divs percentages, you can use flexbox. grid. You have to create the proper structure.
In these boxes then you can organize your content.
You cannot use margins the way you are using them. That is creating all of the white space. You are creating 300px + of white space when you do that.
Webflow does have a bit of a learning curve but the structure is very sound and based off of the HTML and CSS box method. If you think of everything as nested boxes it will be easier. Right now you are just missing the big box everything fits in and the two dividing boxes. Once you set up those properly a lot fo the issues will solve themselves.
Hi, your explanation has made things much clearer for me. I’ve tried making some grids and applying them. The problem is still there but things are starting to feel more logical so thank you for your response! If you have some clues on why the problem persists and where I’ve gone wrong, I’d appreciate it a lot
