Hi fellow CSS folks,
A really quick and newbie question; for some strange reason my CSS code doesn't seem to be working regarding my unordered list (I'm trying to get it to display horizontal and without bullet points)
I'm wondering if it's a small typo on my part, or perhaps a specificity issue?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <HTML> <HEAD> <TITLE>AN ATTEMPT </TITLE> <STYLE> BODY { margin:0; } #header { border-bottom: 1px solid #fff; background: #131313 ; } #logo { width: 284px; height: 122px; position: absolute; left: 42px; top: 0px; } #logoContainer { height: 106px; } #navBar { height: 42px; background: #5E5E5E; #navList ul { list-style-type: none; } #navList li{ display: inline; } </STYLE> </HEAD> <BODY> <div id = "header"> <div id ="logoContainer"> <img id="logo" src ="logo.png" /> </div> <div id ="navBar"> <ul id ="navList"> <li>Link</li> <li>Link</li> <li>Link</li> <li>Link</li> </ul> </div> </div> </BODY> </HTML>
#navList ul Your ul is
#navList ul
Your ul is #navList you have said that the ul is a descendent of an element #navList
Thanks for the speedy
Thanks for the speedy response! I do see now the issue with my original code.
That being said the following still doesn't seem to work for me:
#navBar ul { list-style-type: none; } #navBar li{ display: inline; }
Isn't this any li/ul that descends from a element named navBar right?
Validate your CSS; you're
Validate your CSS; you're missing the closing bracket after #navBar.
Tyssen wrote: Validate your
Validate your CSS; you're missing the closing bracket after #navBar.
I am? (you're referring to the curly brace right) I've just ran this through the W3C CSS validator and it doesn't seem to pick any stray brackets up. Sorry if this seems like I'm just being stupid.
Ah! discard my last comment.
Ah! discard my last comment. I now see what you meant with the missing bracket. Thank you so much for the help.
ParanoidAndroid wrote: Thanks
Thanks for the speedy response! I do see now the issue with my original code.
That being said the following still doesn't seem to work for me:
#navBar ul { list-style-type: none; } #navBar li{ display: inline; }
Isn't this any li/ul that descends from a element named navBar right?
Yes it is any ul/li that has a parent or antecedent/ancestor named #navBar do you need to be careful when using descendent selectors or else use '>' the direct child combinator or just ensure the ul is specified with a token identifier to allow more exacting reference.