日期:2014-05-17  浏览次数:20603 次

LI标签在IE中串行
以下代码第一行最后一个LI(1-8中的8)在IE浏览器中会下降一行,占用了第二行的空间位置。第二行LI标签(a-h)并没有串行。
请问这是哪里的原因?
HTML code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!--
#c UL {
    DISPLAY: inline;
}
#c UL LI {
    BACKGROUND: #EFF7FF;
    FLOAT: left;
    WIDTH: 121px;
    text-align: center;
    margin: 1px;
    height: 21px;
    padding-top: 2px;
list-style-type:none}
-->
</style>
</head>

<body>
<table width="990" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#F47501">
  <tr>
    <td align="center"><table width="100%" cellspacing="0">
      <tr>
        <td bgcolor="#DDEEFF"><font color="#346F0E"><strong>标题</strong></font></td>
      </tr>
      <tr>
        <td><div id="c"><ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
        <li>7</li>
        <li>8</li>
        <li>a</li>
        <li>b</li>
        <li>c</li>
        <li>d</li>
        <li>e</li>
        <li>f</li>
        <li>g</li>
        <li>h</li>
        </ul>
        </div>        </td>
      </tr>
    </table></td>
  </tr>
</table>
</body>
</html>



------解决方案--------------------
HTML code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style type="text/css">
<!--
#c UL {
    margin: 0px;
    padding: 0px;
}
#c UL LI {
    DISPLAY: inline;
    BACKGROUND: #EFF7FF;
    FLOAT: left;
    WIDTH: 121px;
    text-align: center;
    margin: 1px;
    height: 21px;
    padding-top: 2px;
list-style-type:none}
-->
</style>
</head>

<body>
<table width="990" border="1" align="center" cellpadding="0" cellspacing="0" bordercolor="#F47501">
  <tr>
    <td align="center"><table width="100%" cellspacing="0">
      <tr>
        <td bgcolor="#DDEEFF"><font color="#346F0E"><strong>标题</strong></font></td>
      </tr>
      <tr>
        <td><div id="c"><ul>
        <li>1</li>
        <li>2</li>
        <li>3</li>
        <li>4</li>
        <li>5</li>
        <li>6</li>
        <li>7</li>
        <li>8</li>
        <li>a</li>
        <li>b</li>
        <li>c</li>
        <li>d</li>
        <li>e</li>
        <li>f</li>
        <li>g</li>
        <li>h</li>
        </ul>
        </div>        </td>
      </tr>
    </table></td>
  </tr>
</table>
</body>
</html>