2017-08-10 4 views
1

私は以下のHTML & CSSコードの抜粋を使用しています。 「navmenu」アイテムはIEのページの全幅に及んでいますが、Chromeの右側にスペースがあります。完全なページはwww.bobabend.comで見ることができます。誰も私に何を変更するか教えてもらえますか? "navmenu"の項目は両方のブラウザで全幅に及んでいますか?HTML5&CSS3センタリング

.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-->

答えて

1

理由だけ

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

感謝を入れていません。代わりに? – Bob

+0

の代わりに上記を試してください:.navmenu { \t埋め込み:0; \t display:ブロック; \t z-インデックス:2; \tクリア:なし; \t margin-top:-13px; \t margin-left:auto; \t margin-right:auto; }変更はありません – Bob

+0

の代わりに貼り付けられました:.navmenu { \t埋め込み:0; \t display:ブロック; \t z-インデックス:2; \tクリア:なし; \t margin-top:-13px; \t margin-left:auto; \t margin-right:auto; } と変更なし。 – Bob

関連する問題