列表項目中的間距不一致且列表不響應邊距/填充？

好吧，當涉及到HTML時，我覺得很不方便，但是我遇到了一些問題。列表項目中的間距不一致且列表不響應邊距/填充？

我試圖讓我的鏈接在一個體面的地方。這是一個故障。我已經定義了一個960像素寬的容器，放在我的標題中。在容器內部，我有一個圖像，它是我的標誌和一個無序列表，標誌與它和頁面左側邊緣之間的一點空間完美對齊，但是列表正好對齊到右側，直到頁面的邊緣，不管我改變了多少右邊距/填充。

<div id="header"> 
    <div class="container"> 
    <img src="images/headerlogo.jpg" height="240" width="381" /> 
     <ul id="nav"> 
      <li><a href="index.html"><b>.home</b></a></li> 
      <li><a href="blog.html"><b>.blog</b></a><li> 
      <li><a href="portfolio.html"><b>.portfolio</b></a></li> 
     </ul> 
    </div> 
</div>

這是伴隨元素的CSS。

/* Common Classes */ 
.container {width:960px;margin:0 auto;} 

/* Header */ 
#header { 
height:240px; 
background:url(../images/headerbg.jpg) repeat-x; margin:0; 
    } 
#nav {list-style:none; margin:190px 0 0 0; padding:0; float:right;} 
#nav li {float:left; height:45px; text-align: center; padding:7px 1px 5px 5px; margin:0 0 5px 5px;} 
#nav li a {color:#a4b2b7; font-family:arial; font-size:25pt; letter-spacing:-2px; text-decoration:none;} 
#nav li a:hover {color:#2f738c;}

編輯：另外，第三列表項的間距本身比前兩個遠......彷彿它有個別項目的左側保證金......爲什麼呢？ > _ <

我完全錯過了什麼嗎？任何你需要的只是讓我知道。

任何幫助表示讚賞，謝謝你們。

來源

2012-12-19 iXiiN

您沒有關閉第二個<li>項目，這就是爲什麼你有第二和第三個元素之間的空間。它應該是：<li><a href="blog.html"><b>.blog</b></a></li>。

但是，當我給了margin-right: 10px;爲#nav我從右邊10px的空間...

來源

2012-12-19 20:52:11 instead

上帝我真的需要一些睡眠哈哈，非常感謝。很快，我被引導認爲保證金：左下角的頂部（margin：0 0 0 0）是如何設置保證金的正確值，即通過編輯第四個值。這不起作用，這就是爲什麼我感到困惑，但使用保證金 - 正確的工作，我會再次感謝你！ :) – iXiiN

沒問題，但你可以使用margin'margin：190px 100px 0 0;'有頂部和右邊距;）乾杯 – instead

列表項目中的間距不一致且列表不響應邊距/填充？

回答

相關問題