Css子菜單全寬度與兩列不工作

我已經環顧四周解決這個問題，擺弄代碼讓它工作，但沒有任何看。我希望子菜單滿寬兩列。Css子菜單全寬度與兩列不工作

（I已經粘貼它可以作爲我使用CNTRL + K時，我將其粘貼對準到左代碼不能被正確地對準的navigtion完整代碼。）下面是HTML：

/* start navigation */ 

    .navbar-default ul { margin:0; } 
    .navbar-default li ul { display:none; } 
    .navbar-default li:hover ul 
    { width:1200px!important; /* or: width:1200px!important;*/ 
    -moz-border-radius-topleft: 10px; 
    -moz-border-radius-topright: 10px; 
    -moz-border-radius-bottomright: 10px; 
    -moz-border-radius-bottomleft: 10px; 
    -webkit-border-radius: 10px 10px 10px 10px; 
     border-radius: 10px 10px 10px 10px; 
     background-color: #ffffff; 
     float: right; } 
     } 


} 
.navbar-default ul { margin:0; } 
.navbar-default li ul { display:none; } 
.navbar-default li:hover ul { display:block; 

width:200px;} 

.navbar-default li ul li { 
display:block; 
    padding:0; 
} 



.navbar-default 
{ 
background: #ffffff; 
border: none; 
box-shadow: 0px 2px 8px 0px rgba(50, 50, 50, 0.08); 
margin: 0 !important; 

} 
.navbar-default .navbar-brand 
{ 

color: #0066cc; 
height: 80px; 
line-height: 60px; 
padding-left: 0x; 
width:250px; 
text-align:left; 



} 
.navbar-default .navbar-brand h3 
{ 
font-weight: bold; 


} 
.navbar-default .navbar-nav li a 
{ 
color: #ff0000; 
font-weight: bold; 
height: 20px; 
line-height: 0px; 
margin-right: -20px; 



} 
.navbar-default .navbar-nav li a:hover 
{ 
color: #0066cc; 
ul{ 
list-style:none; 
padding:0; 

}  

} 
.navbar-default .navbar-nav > li > a:focus 
{ 
color: #0066cc; 

} 
.navbar-default .navbar-toggle 
{ 
    margin-top: 16px; 
} 
.navbar-default .navbar-toggle .icon-bar 
{ 
background-color: #66AF33; 
color: #FFFFFF; 
} 
.navbar-default .navbar-nav > .active > a, 
.navbar-default .navbar-nav > .active > a:hover, 
.navbar-default .navbar-nav > .active > a:focus { 
color: #0066cc; 
    background-color: transparent; 

} 
.navbar-default .navbar-toggle:hover, 
.navbar-default .navbar-toggle:focus { background-color: ffffff; } 
.navbar-default .navbar-toggle:hover .icon-bar

來源

2015-04-05 Assy

您會添加HTML代碼而不是CSS嗎？ – 2015-04-05 11:31:21

HTML：

<!-- start navigation --> 


    <nav class="navbar navbar-default navbar-fixed-top" role="navigation"> 
     <div class="container"> 
      <div class="row"> 
       <div class="navbar-header"> 
        <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
         <span class="icon icon-bar"></span> 
         <span class="icon icon-bar"></span> 
         <span class="icon icon-bar"></span> 
        </button> 
        <a href="#" class="navbar-brand"><h3>Virtual School</h3></a> 
       </div> 
       <div class="collapse navbar-collapse"> 
        <ul class="nav navbar-nav navbar-right"> 

         <li><a href="#about" class="smoothScroll">ABOUT</a></li> 
         <li><a href="#team" class="smoothScroll">LESSONS</a> 
         <ul> <li><a href="#service" class="smoothScroll">CLASSES</a></li></ul> 
         <li><a href="#service" class="smoothScroll">SERVICES</a></li> 

         <li><a href="#work" class="smoothScroll">PORTFOLIO</a></li> 
         <li><a href="#pricing" class="smoothScroll">PACKAGES</a></li> 
         <li><a href="#contact" class="smoothScroll">CONTACT</a></li> 
         <li><a href="#" class="smoothScroll">CONTROL PANEL</a> 
         <ul> <li><a href="#" class="smoothScroll">LOGIN</a></li> <li><a href="#" class="smoothScroll">SIGN UP</a></li><li><a href="#" class="smoothScroll">SEARCH</a></li> <li><a href="#" class="smoothScroll">LOGIN</a></li> <li><a href="#" class="smoothScroll">SIGN UP</a></li><li><a href="#" class="smoothScroll">SEARCH</a></li> 
          </ul> 

       </div> 
      </div>    
     </div> 
    </nav> 
    <!-- end navigation -->

來源

2015-04-05 11:33:39 Assy

Css子菜單全寬度與兩列不工作

回答

相關問題