填充不适用于IE7和IE8

时间:2013-01-27 18:12:53

标签: html css

我在网上搜索找到了解决这个问题的方法,但我并不幸运。 我知道,当涉及到IE的样式网页时,比观看草的增长更糟糕。

所以,我有填充问题。它在IE9和所有其他浏览器中运行良好,但它在IE7和IE8中失败。可能也是较低的版本(我稍后会检查)

UL认为与背景一致 感谢

 <!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=iso-8859-1" />
  <title>Document sans nom</title>

  <style type="text/css">
   a{font-weight:bold;color:#369;}
   a:link{text-decoration:none;}
   a:visited{color:#936;text-decoration:none;}
    a:hover{text-decoration:underline;}

   .manubar a:link{color: #FFFFFF;}
   .manubar a:visited{color: #DFFFDF;}
   .manubar{
    padding:10px 0 0 0;
    height:26px;
    text-transform:uppercase;
     background-color:#FF8C00;}
    .manubar ul{list-style-type:none;padding:0;margin:0;}
    .manubar ul li{text-align:center;border-left:1px solid 
     #999;display:block;float:left;}
     .manubar ul li:first-child{border:0;}
     .manubar ul li.insert{width:191px;}



     .home{width:94px;}
     .insert{width:94px;}
     .offer{width:94px;}
     .search{width:114px;}
      </style>
      </head>
     <body>

      <div style="height:30px; width:100%;">

      <nav class="manubar">
      <ul >
      <li class="home"  >
        <a href="index.php">Home</a>
    </li>
    <li class="insert">
        <a href="insert.php">Post</a>
    </li>
    <li class="offer">

    <a  href="offer.php">Offer</a>
    </li>
    <li class="search">

        <a  href="searching.php">Search</a>
    </li>


    </ul>
     </nav>
      </div>

      </body>
       </html>

1 个答案:

答案 0 :(得分:2)

HTML5中引入了nav标记。显然它不会支持旧版浏览器。将nav标记替换为div标记以使其正常工作。 (检查提供的链接中的浏览器兼容性部分)

Fiddle (用nav替换div

将以下代码粘贴在Head标记

<!--[if lt IE 9]>
  <script>
      document.createElement('nav');
  </script>
<![endif]-->

<style type="text/css">
  nav{ 
       display: block;
  }
</style>

Source

<强> Working Fiddle