導航欄不流體，以及它裏面沒有集裝箱

Here is my html code! 
<div id="container"> 
     <div class="main-header"> 
      <img id="logo" src="images/1.jpg" alt="vector"> </img> 
<!-- using another div inside of it navigation bar and logo--> 
      <nav class="main-nav"> 
      <!-- remember you have to have floating elements 
      inside of non floating object like main-nav --> 
       <ul> 
        <li><a class ="active "href="#"> Home </a></li> 
        <li><a href="#"> About </a></li> 
        <li><a href="#"> Contact </a></li> 
        <li><a href="#"> Services </a></li> 
        <li><a href="#"> Colaborate </a></li>  
       </ul> 
      </nav> 
     </div> 
    </div> 
Here is my css code! 
    #container{ 
     width:80%; /* again using 80% just to make fluid other wise it could 
     be 960 px; --*/ 
     margin:0 auto; 
     background-color:#2EFEF7; 
     overflow:auto; 
     clear:both; 

} 

#logo{ 
    width:20%; 
    margin:10px 0px;  
} 
.main-nav{ 
    background-color:#882433; 
    height:30px; 
    border-radius:5px; 
    border:px solid #c13046; 
    color:white; 
    } 
     .main-nav ul{ 
     list-style:none; 
     margin:0; 
     padding:0; 
     display:inline-block;  

     } 
    .main-nav li{ 
    color:#ffffff; 
    float:left; 
    margin-left:3px; 

    } 
    .main-nav li a{ 
    color:#ffffff; 
    /* this is used to escape from scroll bar*/ 
    padding:10px 20px; 
    height:20px; 
    display:inline-block; 

} 
    .main-nav li a:hover{ 
    background-color:#efeadd; 
    color:#666666; 
    border-radius:5px; 

} 
.main-nav li a:active{ 
    background-color:#efeadd; 
    color:#666666; 
    border-radius:5px;

}導航欄不流體，以及它裏面沒有集裝箱

我有容器和我所有的導航元素在其內部，但問題是，容器包裝沒有導航欄。第二：問題這個導航欄不流體意味着它不響應，因爲當我縮小我的瀏覽器時，它不能正常工作，因爲我是初學者，所以請特別注意我的問題。

來源

2016-11-26 Raheel Asad

你忘了你的CSS代碼 –

導航欄包裹需要

img {max-width:100%; height: auto}

在容器內部，它對我來說工作得很好。我想你忘了發佈你的CSS代碼。 – Ajaykumar

首先，IMG是自關閉標籤，所以不應該有</IMG> 第二，你在你的CSS

來源

2016-11-26 16:43:52 Vel

導航欄不流體，以及它裏面沒有集裝箱

回答

相關問題