OperaDivaMommy Posted May 28, 2006 Share Posted May 28, 2006 Hi there,I'm somewhat new to Styles, so please pardon the likely noob question:I've set my style for my ordered list so that it's all a different color. But really, I only want the NUMBER to be a different color, but the text entered for that list item to remain the regular text color.Additionally, I'd like to set it up so there's a certain amount of spacing between the list items. I'm just not sure how to do that!Thanks in advance and I look forward to hearing from you soon.All the best,~Laura Ruiz Link to comment Share on other sites More sharing options...
Tarte Posted May 28, 2006 Share Posted May 28, 2006 Could you give us the code? Link to comment Share on other sites More sharing options...
OperaDivaMommy Posted May 28, 2006 Author Share Posted May 28, 2006 ol { font-family: Tahoma, Verdana, Arial; font-size: 12px; color: #9C2858;}ul { list-style-image: url('images/arrow.gif'); font-family: Tahoma, Verdana, Arial; font-size: 12px; color: #000000;} Link to comment Share on other sites More sharing options...
Tarte Posted May 28, 2006 Share Posted May 28, 2006 Well You're talking about numbers but you didn't give me the xhtml's code so i can't really help you.. Link to comment Share on other sites More sharing options...
OperaDivaMommy Posted May 28, 2006 Author Share Posted May 28, 2006 Well You're talking about numbers but you didn't give me the xhtml's code so i can't really help you..<{POST_SNAPBACK}> I'm sorry, I don't really understand. I'm not using xhtml, just html. If you're wanting the code for the list itself, here you go...<ol> <li><strong><a name="1"></a>What are the best features of Vantage Point Apartments?</strong> <ul> <li><font color="#000000">Privacy</font></li> <li><font color="#000000">Small number of units per building</font></li> <li><font color="#000000">Close-knit community</font></li> <li><font color="#000000">Beautiful scenery, vistas and landscaping</font></li> </ul> </li></ol> Link to comment Share on other sites More sharing options...
boen_robot Posted May 28, 2006 Share Posted May 28, 2006 For setting the number's color. Did you tryed styling their containing element instead? I mean, if around the <ol> there's a <div>, give the <div> the color instead. Then give the <ol> the different color to give the list items all the same color.If that doesn't work, then I'll have to break it to you that it won't be possible until all browsers support the content property's counter() function.For whitespace, try setting margin between the <li>s like this: li {margin-bottom: 20px; /* For example */color: #000000; /* Remove the <font>. This is what this could help for */} If you would like the last <li> to be without that margin, you would either have to make a special class for it, where you remove the margin, or wait for browsers to support the CSS3 preudo selector(s) for this. Link to comment Share on other sites More sharing options...
OperaDivaMommy Posted May 29, 2006 Author Share Posted May 29, 2006 For whitespace, try setting margin between the <li>s like this:li {margin-bottom: 20px; /* For example */color: #000000; /* Remove the <font>. This is what this could help for */} The spacing worked GREAT! Thank you so much. I still need to try the other item you'd suggested. Will let you know if it works.~Laura Link to comment Share on other sites More sharing options...
Jonas Posted May 30, 2006 Share Posted May 30, 2006 <html><head><style type="text/css">ol {font-family: Tahoma, Verdana, Arial;font-size: 12px;color: #ff0000;}ul {list-style-image: url('images/arrow.gif');font-family: Tahoma, Verdana, Arial;font-size: 12px;color: #ff0000;}li span {margin-left: 20px;color: #000000;}</style></head><body><ol><li><strong><a name="1"></a><span>What are the best features of Vantage Point Apartments?</span></strong> <ul> <li><span>Privacy</span></li> <li><span>Small number of units per building</span></li> <li><span>Close-knit community</span></li> <li><span>Beautiful scenery, vistas and landscaping</span></li> </ul></li></ol></body></html> Does that do what you want? Except perhaps you want other colours and margins? Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now