Tell us what’s happening:
Hi! This might be stupid to ask but I need help about listing in header. “About us” needs to be displayed in one row but it keeps displaying in 2 instead (About-1st row, us-2nd row). I really cant figure this out. Any suggestion is gratefull.
Your code so far
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/74.0.3729.169 Safari/537.36.
Link to the challenge:
Good Question! But first I noticed that 100% width is a little short of the full width. So go up to settings and under “CSS” check reset. Now a css reset sheet is included in your project and 100% goes all the way across your screen. The answer is that you’re running out of space, so it is breaking on the space between “about” and “us”. But that’s not helpful. I would take a step back and look at what’s happening inside the header element. There is a tug-of-war going on between the koala div and the nav. Each is 50% of the headers width. So change the proportion of the koala div before applying negative pixel adjustments. Then adjust the horizontal position of the ul inside the nav. Now that your remaining header with is maximized for your menu remove the 70px with from nav > ul . The 70px width was limiting the space inside the ul inside the nav minus the pixels that “space-around” was already using. Did you notice that “text-transform” wasn’t working before. It is now. Also you can get rid of the </body> tag and the #page-wrap div since the background-color comes from the header.
Thank You alot!! I menaged to make it. Even tho i had to use float: right; 2 times, in nav to float into its parrent and for nav>ul to float in the nav. That should be OK?
link for pen: https://codepen.io/Swoogy/pen/yWwNqO
Yes! There is more than one way to get things done. After working on your page I decided to play around and get a better understanding of flexbox, there are so many options. I put a background on everything, even if I can’t see them with the current css, so I could see the effect on the boxes. I was able to achieve a similar layout with space-between in the header and then margin-right to move the nav back toward the center ( although I chose to center mine. It’s a positioning experiment ).
I should probably do a simplified one with no id’s and classes so just the elements are styled directly. I was having trouble keeping everything straight the more I experimented. Let me know what you think.
My code so far
BTW your page looks good.
Thank you so much! I started to play around with div
elements and their sizes to achieve goals, spent day just on that… When you go trough lessons, not everything stays in your head so PRACTICE 
I will post something later when I make it, it will be new pen and it is practice for me so see it and let me know what you think!