[RESOLVED] Overriding list styles

liunx

Guest
Here's the target list:


<ul class="docList">
<li><a name="9"></a><strong>TypeA</strong>
<ul>
<li>
<p class="header"><a href=http://www.webdeveloper.com/forum/archive/index.php/"../status/showDocument_e.cfm?id=752">Link here</a> (2005)</p>
<p class="description">Short description...</p>
</li>
</ul>
</li>
</ul>


I have the following line for all the <li> on the site. The target list also gets styled with the following style:

li{list-style-image: url('images/layout/arrow2.gif'); list-style-position: outside;}


I'm trying to override the style of the target list by doing the following:

ul.docList li, ul.docList ul li{list-style-type: none !important;}


The only way I can get any changes to appear is by overriding the image on the global li style:

ul.docList li, ul.docList ul li{list-style-image: url('images/layout/othergraphic.gif'); list-style-position:


I just clued in!

ul.docList li, ul.docList ul li{list-style-image: none;}


This works for me. Lesson of the day, if you set "list-style-image" to something, you'll have to set it to "none" to get rid of it... Problem solved!

:rolleyes:
 
Top