...

View Full Version : how do i specify list id's in the html?



geekygirl
06-29-2011, 01:05 AM
I want to include bulletins in front of certain items in my navigation menu, but not all. How to I go about calling a list id in CSS? For instance, I have home, about, portfolio, and contact buttons in my menu. I want a bulletin before about, portfolio, and contact, but not before home. So how do I style this in CSS?


:) Thanks

Donkey
06-29-2011, 01:48 AM
What do you mean by "bulletin" do you mean bullets?

geekygirl
06-29-2011, 01:50 AM
ha, yes! sorry, typo

Sammy12
06-29-2011, 03:04 AM
I usually just call the first li id="head" and the last id="tail"



<ul id="subNav">
<li>
<a href="#" id="head" class="entry"></a>
<a href="#" class="entry"></a>
<a href="#" id="tail" class="entry"></a>
</li>
</ul>


if you want to style certain ones:



<ul>
<li id="style1"><a href="#"></a></li>
<li id="style2"><a href="#"></a></li>
<li id="style3"><a href="#"></a></li>
</ul>


Is this what you are talking about?

alykins
06-29-2011, 04:17 PM
i think you can make a class that has
list-style-type:none; in it and then have that class called in your li
<li class="nobullets">stuff</li>

Apostropartheid
06-29-2011, 08:55 PM
No, don't do any of that.

You can use a simple pseudo-class to target whichever item it is.
If it is the first item in the list, you can use this:

#nav li:first-child {
list-style: none;
}

alykins
06-29-2011, 08:59 PM
No, don't do any of that.

You can use a simple pseudo-class to target whichever item it is.
If it is the first item in the list, you can use this:

#nav li:first-child {
list-style: none;
}

aside from the obvious downfall of having to code in class in each <li> is there any other reason it (my suggested method) wouldn't work? Not saying I disagree with your method- I think it's better as it targets the elements accordingly- just wondering if there is an inherent reason inline style would not work in this situation.

Apostropartheid
06-29-2011, 11:35 PM
aside from the obvious downfall of having to code in class in each <li> is there any other reason it (my suggested method) wouldn't work? Not saying I disagree with your method- I think it's better as it targets the elements accordingly- just wondering if there is an inherent reason inline style would not work in this situation.

No, there's nothing particular to the method that will make it not work, and indeed was the method most used when CSS support was substantially more patchy than it is today. I would discourage, however, creating "hooks" which don't have any semantic meaning, which is why I proposed a pure-CSS method.

geekygirl
07-03-2011, 08:42 PM
Thanks for the info. I get how to style it in HTML but how do I call it in the CSS? The first child thing worked, but only for the 1st one, how do I call on it for the other options in my nav bar?

vikram1vicky
07-04-2011, 01:27 PM
Use following style to apply bullets to all li:
li {
list-style-type:bullet;
}

create class nobullet and apply them on particular menu items

Cheer :)

geekygirl
07-04-2011, 01:30 PM
Thanks! ;D



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum