title: List item bullets disappearing in IE6 and IE7
body: <p>I have created a list of items using <code>&lt;ul&gt;</code> and <code>&lt;li&gt;</code>. It's works fine in Firefox but in Internet Explorer 6 and 7 I cannot see the list bullet.</p>
  
  <p>Here is what I've done:<br>
  I have a global <code>ul , li</code> reset value. After that I have created two column list using two <code>&lt;ul&gt;</code> block. I am overwriting the <code>ul li</code> global style value none in CSS to list style as <code>disc</code>. when I do this I can see the bulleted list item, but when I set the <code>ul</code>'s width as some specific value the <code>li</code> bullets disappear in IE.</p>
  
  <p>Even if I use list style as <code>list-style-image: url(bullet.gif)</code> that also does not appear in IE 6 and 7.</p>
  
  <p>Here is the HTML code. Please have a look on this and let me know which way I can archive bulleted list in all the browsers.</p>
  
  <pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
  &lt;title&gt;List Sample&lt;/title&gt;
  &lt;style&gt;
  * { padding: 0; margin: 0; }
  
  body { font-size: 62.5%; background-color:#ffffff; font-family:Arial, Helvetica, sans-serif; color:#000000;margin:0; }
  p,ul { font-size: 1em; }
  li { list-style: none; font-size: 1em }
  .clear { clear: both; height:0px; font-size:0px;}
  
  #box1{ font-size:1.5em; margin:10px 0px 0px 10px; width:350px; border:1px solid red; padding:10px 20px; clear:both;}
  #box1 ul#listLeft{ display:inline;}
  #box1 ul#listLeft li{ list-style:disc; border:1px solid red; width:150px; float:left;}
  #box1 ul#listRight li{ list-style:disc; border:1px solid red; width:150px; float:left;}
  &lt;/style&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  &lt;div id="box1"&gt;
  &lt;ul id="listLeft"&gt;
  &lt;li&gt;Popular articles&lt;/li&gt;
  &lt;li&gt;Submit news&lt;/li&gt;
  &lt;li&gt;Newsletter&lt;/li&gt;
  &lt;li&gt;Design contest&lt;/li&gt;
  &lt;li&gt;Winners list&lt;/li&gt;
  &lt;/ul&gt;
  &lt;ul id="listRight"&gt;
  &lt;li&gt;Popular articles&lt;/li&gt;
  &lt;li&gt;Submit news&lt;/li&gt;
  &lt;li&gt;Newsletter&lt;/li&gt;
  &lt;li&gt;Design contest&lt;/li&gt;
  &lt;li&gt;Winners list&lt;/li&gt;
  &lt;/ul&gt;
  &lt;div class="clear"&gt;&lt;/div&gt;
  &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>