似乎無法讓我的導航欄旁邊，我的標誌

-6

body{ 
 
    margin: 0; 
 
} 
 

 
.logo { 
 
    text-indent: -999999px; 
 
    background: url('logo3.png'); 
 
    width: 216px; 
 
    height: 219px; 
 
} 
 

 
.header{ 
 
    width: 100%; 
 
    height: auto; 
 
    background-color: #eef3f5; 
 
    padding-top: 24px; 
 
} 
 
.headerContent { 
 
    width: 1024px; 
 
    height: auto; 
 
    margin: 0 auto; 
 
} 
 
.headercontent a img{ 
 
    width: 659px; 
 
    height: 144px; 
 
    margin: 0px auto; 
 
    display: block; 
 
} 
 
.nav { 
 
    height: 40px; 
 
    background: #0000ff; 
 
    margin-top: 20px; 
 
    float: right; 
 
} 
 
.nav ul{ 
 
    margin: 0; 
 
    padding: 0; 
 
} 
 
.nav ul li{ 
 
    list-style: none; 
 
} 
 
.nav ul li a{ 
 
    text-decoration: none; 
 
    float: left; 
 
    display: block; 
 
    padding: 10px 20px; 
 
    color: black; 
 
} 
 
.nav ul li a:hover{ 
 
    color: white; 
 
} 
 
.headerbreak { 
 
    width: 100%; 
 
    height: 0; 
 
    border-bottom: 2px solid #ff0000; 
 
}


 
<title> Grenada Down Syndrome Association</title> 
 
    
 
    
 
    
 
<body> 
 
    <div class="header"> 
 
    <div class="headerContent"> 
 
     <a href="#"> 
 
      <img src="logo3.png" alt="Grenada Down Syndrome Association"/> 
 
     </a> 
 
     
 
    <div class="nav"> 
 
     <ul> 
 
      <li><a href="home.html">Home</a></li> 
 
      <li><a href="aboutus.html">About Us</a></li> 
 
      <li><a href="events.html">Events</a></li> 
 
      <li><a href="contact.html">Contact Us</a></li> 
 
      </ul> 
 
     
 
      </div> 
 
     </div> 
 
     <div class="headerbreak"> </div> 
 
    </div> 
 
</body> 
 
</html>

我真的需要一些幫助，這傢伙

來源

2016-02-12 Samira Mc Queen

你必須做大量的變化CSS。

首先，您已經給出長寬度.headerContent減少它或將其除去徽標旁邊。

然後使用display:inline-block。

給下面的CSS：

.headerContent > a { 
    display: inline-block; 
    vertical-align: top; 
} 


.nav { 
    background: #0000ff none repeat scroll 0 0; 
    display: inline-block; 
    height: 40px; 
    vertical-align: top; 
} 

.nav ul li{ 
    list-style: none; 
    float: left; 
}

Working Fiddle

來源

2016-02-12 03:04:21 ketan

你回答這個沒有問，科坦問題？通過回答這樣的低質量問題，你鼓勵其他人喜歡它，從而降低SO的質量。 SO的使命是讓互聯網更好，但不是提供免費的「網頁設計」或「修復我的代碼」服務。你應該勸阻這些問題，而不是鼓勵他們。 –

這是個問題。「*似乎無法讓我的導航欄旁邊的我的標誌」* – ketan

我知道，這就是爲什麼我會給他們機會學習如何發佈。因爲這是他/她的第一篇文章。 – ketan

似乎無法讓我的導航欄旁邊，我的標誌

回答

相關問題