XHTMLboy Posted May 22, 2010 Share Posted May 22, 2010 Hi, just wondering if anyone could help me as i have just been learning xhtml and i am now going on to css. In a book i got it told me to use the following code to make a navigation for a webpage. <ul class="nav"><li><a href="#">Home</a></li><li><a href="#">support</a></li></ul> But the only trouble is, when i go to load up the web page, it desplays bullet points at the start of my link. But all i want is a like that could get me to differentpages. I would be very gratefull if you could help me PLEASE!! Link to comment Share on other sites More sharing options...
chibineku Posted May 22, 2010 Share Posted May 22, 2010 In your CSS file/style tags, use:ul {list-style-type: none;}That will get rid of your bullet points. It's a good idea to be more specific, though. For example, give your nav list an id (such as, you know, nav), and then refer to it as:#nav ul {list-style-type: none;}So that not every list will be without bullets. It's more work to specify it each time, but I find that it's also more maintainable to be specific as you go along. Link to comment Share on other sites More sharing options...
XHTMLboy Posted May 30, 2010 Author Share Posted May 30, 2010 Thankyou for your help, at the moment i'm finding css quite hard to learn, not that hard but harder then xhtml anyways, so thanks for the tip about being more spacific aswell Link to comment Share on other sites More sharing options...
BlackBullet Posted June 27, 2010 Share Posted June 27, 2010 A slight correction of the CSS selector: ul.nav {list-style-type: none;}'#nav ul' would get all un-ordered lists inside of any elements that have an id of 'nav'. 'ul.nav' gets any un-ordered lists with a class of 'nav'.And by the way, if you wanted a horizontal menu, just add this CSS block:.nav li {display: inline;margin-left: 2.5px;margin-right: 2.5px;}'display: inline' changes the display of each list item so that it is on one line (like a <span> tag). The margins are just to make it look better by spacing each item a little bit. Link to comment Share on other sites More sharing options...
thescientist Posted June 28, 2010 Share Posted June 28, 2010 A slight correction of the CSS selector:'#nav ul' would get all un-ordered lists inside of any elements that have an id of 'nav'. 'ul.nav' gets any un-ordered lists with a class of 'nav'.And by the way, if you wanted a horizontal menu, just add this CSS block:.nav li {display: inline;margin-left: 2.5px;margin-right: 2.5px;}'display: inline' changes the display of each list item so that it is on one line (like a <span> tag). The margins are just to make it look better by spacing each item a little bit.but since you're only supposed to have one unique ID on each page, it shouldn't really be a problem. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.