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 Joseph Herson
Joseph Herson
1,226 Points

Why won't my unordered list correspond with the browser?

My css is linked to my html, but when I select my unordered list in my css, it won't do as I command in the browser. i.e. it won't float and it won't correspond to my list-style or margins. Everything else in the css is working perfectly.

6 Answers

Dave Evans
Dave Evans
13,160 Points
Dave Evans
Dave Evans
13,160 Points

Can you include part of your code (html and css)? We need to ensure you are targeting the correct aspect of your list.

Brenden Greiser
Brenden Greiser
5,979 Points
Brenden Greiser
Brenden Greiser
5,979 Points

try adding the commands to the list items instead of the unordered list

Sreng Hong
Sreng Hong
15,083 Points
Sreng Hong
Sreng Hong
15,083 Points

if you're not sure, it wouldn't do as your command. try to apply the color, so it'll be easy to see whether it's working.

Joseph Herson
Joseph Herson
1,226 Points
Joseph Herson
Joseph Herson
1,226 Points

Here is my HTML and CSS, respectively. I have tweaked other things in the css, and they respond in the browser. So I can't figure out why I get no response with the unordered list.

<div class="grid_8 omega"
      <ul class="nav">
        <li><a href="#">About</a></li>
        <li><a href="#">Cupcakes & Prices</a></li>
        <li><a href="#">Locations</a></li>
        <li class="last"><a href="#">Contact Us</a></li>
      </ul>
</div>

ul.nav {
    margin: 120px 0 0 0;
    list-style: none;
    float: right;
}

ul.nav li {
    float: left;
    margin-right: 40px;
}
Dave Evans
Dave Evans
13,160 Points

That's an easy one. If you add the '>' after your div class="grid_8 omega" it'll work.

Sreng Hong
Sreng Hong
15,083 Points
Sreng Hong
Sreng Hong
15,083 Points

Like Dave said you might forget to close the div tag.

Joseph Herson
Joseph Herson
1,226 Points
Joseph Herson
Joseph Herson
1,226 Points

Guys, thanks a million. Didn't put the closing bracket on the div. I'm new to this, untrained eyes.