li列表項標簽中插入圖片浮動出現的一種奇怪現象_Div+CSS教程

教程Tag：暫無Tag,歡迎添加,賺取U幣!

　　如下面的案例，若只對圖片應用浮動，FF下一切正常，但IE總多出來一行：

代碼調試框 [www.wf0088.com]

[ 可先修改部分代碼再運行查看效果 ]

　　解決的辦法是對圖片的父元素li應用浮動，即可消除這樣的希奇現象，目前還不知道成因：

代碼調試框 [www.wf0088.com]

<!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=gb2312" />
<title>無標題文檔</title>
<style type="text/css">

* {
margin:0;
padding:0;
}
.phototext{
color:#999999;
text-align:left;
float:left;
font-size:12px;
list-style:none;
}
.phototext img{
margin:0 5px;
float:left;
}
.phototext666{
color:#666666;
}
.phototext li{
float:left;
line-height:1.8em;
padding-left:5px;
}
.phototext li a, .phototext li a:hover{
color:#000000;
font-size:14px;
}
#soyi{
width:180px;
background-color:#FFCC00;
}

</style>
</head>
<body>
<div   class="plrhdpr"   id="soyi">
  <ul class="phototext">
    <li><img src="http://p1.mb5u.com/divcss/preview_s01.jpg" alt="" width="72" height="82" class="photorim" /></li>
    <li><a href="#">藍色經典</li>
    <li id="dbjbtpt"    class="phototext666">15張照片</li>
    <li>1月15日更新</li>
  </ul>
</div>
</body>
</html>

[ 可先修改部分代碼再運行查看效果 ]