https://codepen.io/martin21/pen/PoZqbdQ
I have been working on this a while. My header is spreading out just fine but my three list items are staying vertical.
I want them to be like menu item in the header space out horizontally.
If you’re talking about the "clickme"s, then it’s not about flex. It’s because you are using a ul, which brings certain formatting with it.
Or you could just not us an unordered list.
Use display: flex on ul tag, not on nav , since it’s a parent of list items and flex works only for direct children of an element
Thank you. I changed html to ol but that didn’t change it. Your link gave me the idea to do this:
#nav-bar ul{
add ul or ol after the id in the css and it spread the horizontally like I want but they are squashed together. Tried adding width and gap, no luck yet. But thanks for the help.
Yes that worked, any idea why they squash together?
Found it, justify-content: space-around; And add 500px width.