So I am struggling to make a Div Block containing content take the “full width” of its parent element (a section with max width 1100px). When the Section’s Layout Display is “Block”, then it doesn’t cause issues - this is how I have set up all other sections and content on the page and its fine.
But for a header section, I need to use flexbox, in order to center the content Vertically. Any thoughts?
Here is what I am facing when section layout display = flexbox:
Thanks for the fast reply. So I have now done that to the container (child of the section), and also set it to 100% width. However, I fear that because I was/am using containers with max widths, rather than fixed widths, (for responsive reasons), that this “work-around” will kill that… am I right in thinking this?
If you have any doubt, replace containers by divs and set your own rules for their sizing. Let me know how it goes and if you end up with exactly what you wanted
It is working, I am just surprised that now that width is 100%, that it is still respecting the Max width of 1100px. I would have thought that it would “overwrite” that rule. But maybe I don’t fully understand this as much as I thought
No that’s easy. It reaches for 100%, but there’s a maximum So it stops at the maximum. There is no overwrite, those rules are different and they work together.
Mastering min and max width will allow you to craft the most advanced simple and solid layouts. I swear
Edit : don’t declare rules that stay at 0 or None. Alt click on the blue label to erase them. Only put 0 in that field if there was a value in it when the label was orange.
