Responsive details + Horizontal Navigation Scaling

Good evening,
I’m building this test site and I am interested in learning how to modify my css so that the horizontal nav (li) will scale with the rest of the document. Right now if the window is below max width, it starts to cut off the li on the right.

Please see pen.

1 Like

The first thing I’d do is apply display: flex to the ul, as that should really be applied to the flex container by default. Then I’d remove the left-right padding on the list items, as flex will center them all nicely anyway.

Thank you.
I don’t know if this is kosher to ask here or if I should start a new topic…

When my @media breaks at 640 (smaller than 640px) I’m trying get the ‘aside header’ content (.module) to display as they do but simple distributed evenly side by side as the aside moves to horizontal orientation. (Instead of flush left currently shown). EDIT: SOLVED


is there any way to move the .leftC (left column mentioned above) to display BELOW .mainS via CSS only?

Yes, in modern browsers. You’d wrap the two in a container with display: flex, after which you can set the order they appear in.

1 Like

Thanks @ralphm. That did the trick

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.