html - 填充在 IE7 和 IE8 中不起作用

标签 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>

最佳答案

nav标签是在 HTML5 中引入的。所以很明显它不会支持旧的浏览器。将 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

关于html - 填充在 IE7 和 IE8 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14550481/

相关文章:

javascript - 在 javascript 中转义/处理 "special typefaces"单引号

javascript - 使用浏览器后退按钮时,我的应用程序中的标题不会更改

html - 是否有必要在 twitter bootstrap 中包含 normalize.css 和 h5bp?

html - 我的导航菜单不适用于 IE < 9

jquery - Bootstrap 旋转木马与超大屏幕中的视频

javascript - 根据类名称扩展菜单栏元素,包括子菜单

javascript - 悬停在图像上播放声音

html - 响应式设计中的复杂 flex 菜单

javascript - 我如何使用 css 或 jquery 更改按钮图像并在单击时将其设置为动画?

html - CSS 按钮不会在 div 中心对齐