的CSS按鈕定位沒有按鈕

我想我的定位導航直列之間的空間，但沒有按鍵之間的空間。你可以建議一些小費如何將它們在頁面的中間位置爲好。我曾嘗試與margin:0, padding-left:0px但仍然有它們之間的空間。下面是HTML代碼：的CSS按鈕定位沒有按鈕

<div id="nav"> 
<nav role="navigation"> 
<ul> 
<li><a href="./" class="button" title="Go to the home page"</title>Home</a></li> 
<li><a href="about.php" class="button">About</a></li> 
<li><a href="contact.php" class="button">Contact</a></li>  
</ul></nav></div>

和CSS樣式：

.button{ 
color: rgb(0, 0, 0); 
font-size: 15px; 
padding: 11px; 
    text-shadow: 0px 2px 2px rgba(144,150,150,0.75); 
    background: rgb(255, 255, 248); 
    background: -moz-linear-gradient(90deg, rgb(255, 255, 248) 69%, rgb(56, 2, 137) 92%); 
    background: -webkit-linear-gradient(90deg, rgb(255, 255, 248) 69%, rgb(56, 2, 137) 92%); 
background: -o-linear-gradient(90deg, rgb(255, 255, 248) 69%, rgb(56, 2, 137) 92%); 
background: -ms-linear-gradient(90deg, rgb(255, 255, 248) 69%, rgb(56, 2, 137) 92%); 
background: linear-gradient(0deg, rgb(255, 255, 248) 69%, rgb(56, 2, 137) 92%); 
-webkit-box-shadow: 0px 2px 1px rgba(50, 50, 50, 0.73); 
-moz-box-shadow: 0px 2px 1px rgba(50, 50, 50, 0.73); 
box-shadow:   0px 2px 1px rgba(50, 50, 50, 0.73); 
    } 
#nav li{ 
display:inline; 
} 

#nav ul{ 
list-style-type:none; 
margin:0; 
    } 
#nav ul li a{text-decoration:none; 
font:Tahoma, Helvetica, Arial, sans-serif; 
letter-spacing:0.1em; 

}

來源

2013-02-07 C0ld

首先到中心您導航到屏幕採用波紋管的中間。

#nav{ 
     width:960px; -- change me to correct size 
     margin-right:auto; 
     margin-left:auto; 
     height:110px; -- change me! 
}

至於列表，這將採取列表，並從左到右排列。鏈接之間唯一的差距應該是小填充因此它不會對彼此的頂部看。

#nav ul { 
    display: inline; 
    list-style: none outside none; 
    margin: 0; 
    padding: 0; 
} 

#nav li { 
    display: inline; 
    font-size: 11px; 
    padding-right: 2px; 
    padding-left: 2px; 
    width: 100px; -- this depends on the number of buttons you have of course. 
}

希望這會有所幫助！

來源

2013-02-07 23:23:59

在您#nav li，使用display: block和float: left代替，就像這樣：

#nav li { 
    display: block; 
    float: left; 
}

見DEMO。

來源

2013-02-07 23:21:28 zakangelle

如果要在無空格和空格的情況下顯示它，請嘗試使用letter-spacing或word-spacing，並使用負值

來源

2013-02-07 23:25:12 pwolaq

的CSS按鈕定位沒有按鈕

回答

相關問題