Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Jeremy Gonzales
Jeremy Gonzales
8,980 Points

Trying to Float: Right Nav Links, But It Won't Inherent the Background of the Header

I have the following practice website: http://jeremy-gonzales.com/

The problem is when I remove the float statement, the contact, about, and portfolio links have the same green background as the the rest of the header. But once I put float: right, the green background is no longer behind the navigational links. Instead it becomes just the white background (the letters are white so it disappears). Why is it not staying with the green background because nav is till contained in the header?

I am probably missing something very subtle.

Another side question is in the Treehouse Exercises, the instructor had nav for the selector, why wouldn't it be required to do 'header nav' to select the element?

Thanks!

Jude Molloy
Jude Molloy
7,470 Points

Hi, I'm confused about the first part of your question but i had a look at your website and the navigation links appear white because you didn't give them the class selected. ( class="selected" ) I hope this can help you out if you get stuck just let me know :)

2 Answers

Jeremy Gonzales
Jeremy Gonzales
8,980 Points
Jeremy Gonzales
Jeremy Gonzales
8,980 Points

Maybe a picture would help :) This is the goal: http://i.imgur.com/ccBJ1PE.png

The selected class is just for the 'active' page, it turns the link dark. So the background should be green like the top of the page behind the links: portfolio, about, and contact. When I don't have float: right; in nav (responsive.css), the links appear correctly, but they are centered. The goal is to be on the right and to take on the green background. Once they are floated right, they no longer have the green background.

http://jeremy-gonzales.com/css/responsive.css http://jeremy-gonzales.com/css/main.css

Thanks!

Jeremy Gonzales
Jeremy Gonzales
8,980 Points
Jeremy Gonzales
Jeremy Gonzales
8,980 Points

Well now, I dont know what to say, I re-did the main.css, and now it works, but I don't have a copy of the old one so I can see where I messed up. I guess this is where github is useful?

Thanks.