如何在CSS中做到這一點

我的標記看起來是這樣的：如何在CSS中做到這一點

<div class="header-section"> 
    <a href="#" class="logo"><img src="logo.png" /></a> 
    <div class="navigation"> 
     <ul> 
      <li><a href=# class="active">Home</a></li> 
      <li><a href=#>Bakery</a></li> 
      <li><a href=#>Fishery</a></li> 
      <li><a href=#>Casino</a></li> 
      <li><a href=#>Disney Land</a></li> 
     </ul> 
    </div> 
    <div style="clear:both" /> 
</div>

和重要的CSS是：

.header-section { 
    margin: 30px 0; 
} 

.header-section .logo { 
    float: left; 
} 
.header-section .logo img{ 
    border: 0; 
} 
.header-section .navigation { 
    float: right; 
    margin-top: 23px; 
} 
.header-section .navigation ul { 
    list-style: none; 
} 
.header-section .navigation ul li{ 
    font-size: 18px; 
    font-family: Tahoma, Arial, Verdana; 
    float: left; 
    margin: 0 20px; 
}

所以鏈接在一個水平線上格式化的權商標。最初，我有想法讓他們只是在屏幕房地產不允許他們在一行時換行，但實際發生的是在包裝之前，他們跌到了標誌之下。我對此感到高興，直到我看到這一點 - 具有諷刺意味的是，IE以我想到的方式呈現。

所以我的問題是 - 我怎麼才能得到的鏈接包裝之前，只是貼在徽標圖像下面？

來源

2011-01-20 jcuenod

如果你使用一個設置寬度的`＃wrap` div（比如`860px`或者其他東西），那麼你將不會遇到這個問題，因爲它總是會有足夠的空間。然後只需使用'margin：0 auto;`並且您的佈局將始終居中在頁面上。 – Andrew 2011-01-20 19:38:25

我不想要一個固定的寬度。 – jcuenod 2011-01-20 21:42:10

化妝標籤作爲一個塊級元素：

，並添加寬度&高度..

.header-section a { 
display:block; 
width:100px; 
height:100px; 
}

來源

2011-01-20 19:31:40 Abudayah

嘗試把<a href="#" class="logo"><img src="logo.png" /></a>navigation div end和兩部分的修復後寬......它應該工作

來源

2011-01-24 12:07:02 Mahima

如何在CSS中做到這一點

回答

相關問題