Trying to build a site quickly, so figured 960 wide is fine. Now there’s all kinds of weird hidden stuff happening because I used the Container component. Every time I search this out, all I see time after time is user feedback that basically says “DON’T USE CONTAINERS, USE YOUR OWN DIV.”
So, basic question, why are they even there?
What “hidden” values do they seem to contain?
If I don’t want to use them, do I now seriously have to manually replace them one at a time with a div?
EDIT: How to change the padding of every container? Seems impossible.
Really, what’s the point of them if no one likes them?
I’m not part of the “no one” group. I favor using a container as it does just that, contains everything in a nice neat area. I can still utilize the area outside or behind the container.
One question I have at the moment, I cannot change the padding; it’s locked at Auto. Yet, clearly, there’s some kind of padding there, when I switch to tablet or mobile — but, still… I cannot change the padding. It’s stuck at some default I have no control over.
Are you saying stick it inside a div block to control this? Again, that seems to defeat the whole purpose of a “container,” though it might help me with my quick fix rather than try to replace them all… at the moment, I just need to add some extra padding around them all for tablet and mobile. But, I still fail to see their purpose if they consistently require some work around.
EDIT: ALL THIS TIME, I’ve now finally realized that the containers just have fixed widths, and because the default display for horizontal tablets is just a little bit wider, it looks to the noobie as if it suddenly has some padding. ALL THIS TIME.
Webflow peeps, you guys really need to test and re-test with real users that are new to the platform. And, your tutorials definitely over simplify things, and leave important details out. Seriously, I have to take medicine because of all this frustration.
Yes, I could setup and use a Div, but I find containers eliminate a lot of work. I prefer a container as it also prepares my site for easy adjustments in screen sizes. Also yes, for putting containers in a Div. I almost put everything is a Div so I can manipulate, move, control, etc. whatever is inside much easier.
Because I have had issues with container elements before, I’ve just been creating my own so I have full control over how they behave. I make their width 960 with auto margins left/right and then make their width 100% (with a bit of left/right padding to give the contained content some breathing room from screen edges) cascading down for all mobile views.
Webflow had containers back before flex and grid was available. With Webflow it is hard to get rid of legacy things since once it is used by people you would create a support nightmare taking a feature away and there is no practical way to migrate from floats to flex (would probably break untold sites).
The modern way to layout is using Flexbox and even more modern would be CSS Grid.
This makes the some sense. But, since it’s a div with preset values, you’d think they could just “flip a switch” and make every one ever used into a div with those settings, since they’re “locked” anyway. More of a case against it, too, is that they still have a recently made tutorial on it (which skips all the important details about it having fixed values). I think they should really NOT promote it, as I might have mentioned, for me as someone who’s new-ish to Webflow it’s “secrets” are confusing to use, as it removes control. I came to Webflow as a designer because I want as much control as possible.
I guess lesson learned… I simply will never use them again.
Wow, some interesting info in there. Then, it basically sounds like if I stick to sections, Flexbox, grids and divs… then, life is grand? Is that the gist of it? Then, no more odd unknown fixed widths or paddings or mysteries? Because, as someone who is new, that really confuses me the most almost constantly. That, and how to “stack” elements on top of each other.
“the road to hell is paved with good intentions.” Love Webflow, but it seems some of what they’ve done to try to simplify things for newcomers, actually ends up confusing in the long run. But, then again, the web evolves; I’m guessing that’s half the problem (or solution!).
I kinda think that there should ONLY be a Div, and then depending on the Layout>Display setting, the icon in the Navigator changes to match that. That would be simple and clear. and NO defaults of any sort for anything… ever. Except maybe header type sizes.
hey @TheCat How do you deal with the problem of padding in Containers? On large screens there is padding on left and right, but this disappears on mobile, causing text to touch the edges of the screen…
Don’t need different containers. The problem with using a custom div as a container is that it makes using the Navigator less efficient, as they are marked with the normal div symbol, not the container symbol.
I could add some CSS code to the whole site to add margin on the container, I’m just curious as to why the smaller viewpoints don’t have any margin in the Webflow container.
