Trying to figure out how to change color of a bullet under <ul><li> without resorting to creating a bullet with the color I want as a jpg while leaving the color of the text in the <li> alone.
/stext text/
.stext { color : #000000; font-family: Times, serif; font-weight : normal; font-size : 14px; font-style: normal;
letter-spacing : 0pt; text-decoration: none; line-height: 17px; margin: 0px 0px 6px 0px;}
.stext ul li { color : #000000; font-family: Times, serif; font-weight : normal; font-size : 14px; font-style: normal;
letter-spacing : 0pt; text-decoration: none; line-height: 17px; margin: 0px 0px 6px 0px;}
Thanks
sponge
I believe you are missing a basic concept of what an LI is. The bullet is generated ‘content’ ( actually is a ‘marker’… but that’s another issue all together) within the LI tag, so whatever you do to the LI you do to the bullet.
So really we have two options here ( other than graphics).
- Wrap the content of the LI ( if not already so) and target each separately.
<LI> <SPAN>inline li text</span></LI>
<LI><P> pragraph....</P><P> pragraph....</P><LI>
li {color:red;}
li>*{color:black;}
OR generate the bullet yourself. This adds its own set of challenges and advantages but does give you a lot of control over the “bullet”
li{ list-style:none;}
li:before{ list-style:none; content :"*"; color:red; float: left; margin-left:-2em;}
Hope that helps.
Very nice. I can make this work another time. Being that I am working in a proprietary CMS, I opted to use a Unicode for bullet and span the color selector around it. Spacing controlled, color controlled, and the text then took up the class designated for the cell I was working in.
I like your css approach and will use it in the future.
sponge