About to start a fairly large website in webflow. The final product will be exported and brought into WordPress, however the initial font end build and prototyping will be done in WebFlow.
Lately, I have found myself not using containers. As I always use the custom script to make my layouts 1170px wide, I often find that I end up building my own custom container (div block - max width 1170px) to achieve the same result as to what a container does.
Can anyone let me know if there are any pitfalls in doing this? By not using the ‘container’ element what am I missing out on?
The main reason to use a container, is if you want to take advantage of the preset 960 grid system. The container is just a div, with preset styles
Our grid is 12 columns, 60px width for each column. Each column has 10px left and right margin, creating a gutter between columns of 20px.
The container has default styles to center the container (and content within) on the page. The max width of the content within the container is 940px.
So it really is a design choice. If you do not care about the grid columns, or plan your layout using the grid, then creating your own div block or section with a certain max width will work fine as well.
Quite often I like to make sites using just sections and divs. I give my section a percentage based width with left and right margin set to auto.
Then I use div structuring methods to place divs inside my section, and give them percentage based widths as well. Knowing the css box-model is good for these kinds of layouts.
By putting boxes within boxes, I can always ensure my content does not overflow, and I have a fine control over responsive behavior on different viewports.
I am sure others have their reasons they may or may not use containers I hope this helps a bit Cheers, Dave
I think I will use most of my body copy elements inside the container as I can make use of the grid setup. Other items I am happy to build my own custom containers - if that makes sense
Cheers, Dave