下拉菜单在ie6的表现状态 求解~~
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Busy - 电商</title>
<script type="text/javascript">
function selectList(){
var selList=document.getElementById("select_options").style;
var selTriangle=document.getElementById("select_triangle").style;
if(selList.display=="none"){
selList.display="block";
selTriangle.transform="rotateZ(180deg)";
}else{
selList.display="none";
selTriangle.transform="rotateZ(0deg)";
}
}
</script>
<style>
body,ul,h3{margin: 0; padding: 0;}
li{list-style: none;}
.select{height:22px; border:1px solid #ccc; line-height:22px; position:relative; z-index:4;padding:0 24px 0 10px; display:inline-block;/*float:left;*/}
.show_select{ position:absolute; top:22px; left:-1px; width:100%; border:1px solid #ccc;background: #fff;font-size: 12px;top: 19px; }
.show_select li{ color:#999; text-indent:11px;}
.show_select li:hover{background:#9CF; color:#fff;}
.select h3{font-size:12px; font-weight:normal; height:22px; line-height:22px; }
#select_triangle{
border-width: 4px 4px 0;
border-style: solid dashed dashed;
border-color: rgb(80, 174, 248) transparent transparent;
width: 0; height: 0;
overflow: hidden;
position: absolute;
top: 10px;
right: 8px;
transition:0.2s;
}
</style>
</head>
<body>
<div class="select" id="select" onclick="selectList()">
<h3>北京市 海淀区 五环内</h3>
<i id="select_triangle"></i>
<ul class="show_select hide" id="select_options" style="display: none;">
<li>朝阳区三环</li>
<li>朝阳区三环</li>
<li>朝阳区三环</li>
<li>朝阳区三环</li>
<li>朝阳区三环</li>
</ul>
</div>
</body>
</html>老师 这是其中一个下拉菜单的代码 在其他浏览器都没问题 可是到了ie6就会宽度变成100% 打死也找不出原因 求解释~~
