诡异的list-style bug ie6、ie7下 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
	<style type="text/css">
		*{ margin:0px; padding:0px;}
		ul{ width:300px; padding-left:30px;  }//padding必须卸载ul中，写在li中无效
		li{ width:180px; list-style:circle outside; }
    </style>
</head>
<body>             
        <ul>                 
          <li>品牌商家免费提供试用品（免费试用总价值不低于1000元；付邮试用数量不小于200件）数量见合作细节</li>
          <li>品牌商家自己发货，邮费自己承担</li>
        </ul>         
</body>
</html>

　　Chrome下

  

ie6、ie7下：

 现在把css改为下面，就可以了，为什么li加了宽度会这样呢？想不明白，求高手解答

<style type="text/css">
		*{ margin:0px; padding:0px;}
		ul{ width:200px; padding-left:30px;  }
		li{  list-style:circle outside; }/*width:180px;*/
    </style>

　

posted @ 2012-09-10 19:43  xjinza  阅读(159)  评论(0)    收藏  举报