我正在使用以下HTML和CSS代码摘录。 “ navmenu”项跨越IE中页面的整个宽度,但在Chrome右侧保留空间。可以在www.bobabend.com上查看完整页面。谁能告诉我要进行哪些更改,以便“ navmenu”项在两个浏览器中均能显示完整宽度?



.navmenu {
  padding: 0;
  display: block;
  z-index: 2;
  clear: none;
  margin-top: -13px;
  margin-left: auto;
  margin-right: auto;
}

.navmenu ul {
  padding: 0;
  background-color: #0000FF;
}

.navmenu li {
  padding: 0;
  list-style: none;
  position: relative;
  background-color: #006500;
  float: left;
  border: thick ridge #CC9900;
}

.navmenu ul li a {
  text-align: center;
  font-family: source-sans-pro, "Trebuchet MS", Verdana, Arial, sans-serif, helvetica;
  text-decoration: none;
  height: 45px;
  width: 200px;
  display: block;
  color: #FFF;
  text-shadow: 1px 1px 1px #000;
  font-size: medium;
  vertical-align: middle;
  line-height: 40px;
}

.navmenu ul ul {
  position: absolute;
  visibility: hidden;
  top: 32px;
}

.navmenu ul li:hover ul {
  visibility: visible;
}

.navmenu li:hover {
  background: #09F;
  z-index: 1;
  font-weight: bolder;
}

.navmenu ul li:hover ul li a:hover {
  background: #CCC;
  color: #000;
}

.navmenu a:hover {
  color: #000;
  font-weight: bolder;
}

.clearfloat {
  clear: both;
  margin: 0;
  padding: 0;
}

.wrapper {
  z-index: 1;
  width: 1050px;
  margin-left: auto;
  margin-right: auto;
}

<div class="wrapper">
  <div class="navmenu">
    <ul>
      <li><a class="long bold" href="Electrical Equipment Reliability 8-12-2014 Sec.pdf" target="_blank">Electronics<br>Reliability Paper</a>
      </li>
      <!--end main LI-->
    </ul>
    <!--end main UL-->
  </div>
  <!--end navmenu-->
  <div class="navmenu">
    <ul>
      <li><a class="bold" href="A-Board Insurance Claim Analysis 1-4-2015 small.pdf" target="_blank">Case Report Example</a>
      </li>
      <!--end main LI-->
    </ul>
    <!--end main UL-->
  </div>
  <!--end navmenu-->
  <div class="navmenu">
    <ul>
      <li><a class="bold long" href="dui.pdf" target="_blank">Attorney<br>Commentaries</a></li>
      </li>
      <!--end main LI-->
    </ul>
    <!--end main UL-->
  </div>
  <!--end navmenu-->
  <div class="navmenu">
    <ul>
      <li><a class="bold long" href="Case Experience Synopsis.pdf">Partial Case<br>Experience Summary</a>
    </ul>
    <!--end inner UL-->
    </li>
    <!--end main LI-->
    </ul>
    <!--end main UL-->
  </div>
  <!--end navmenu-->
  <div class="navmenu">
    <ul>
      <li><a class="bold" href="https://www.myfloridalicense.com/LicenseDetail.asp?SID=&id=68D81F7B226A04EF73021FA90FD37339" target="_blank">FL State License</a>
      </li>
      <!--end main LI-->
    </ul>
    <!--end main UL-->
  </div>
  <!--end navmenu-->
</div>
<!--end wrapper-->

最佳答案

为什么不放

.navmenu {
    padding: 0;
    z-index: 2;
    clear: none;
    margin-top: -13px;
    margin-left: 0;
    margin-right: 0;
}

关于html5 - HTML5和CSS3居中,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/45621742/

10-12 07:22