我想在無序列表中的元素之前應用一定量的空間。這是網址:http://hottdoggfilms.com。我嘗試將狗的圖片與徽標集中在其他列表元素之間。但是「最近的工作」和「關於我們」的元素之間存在不均衡的空間。我的標記是:將邊距單獨添加到內嵌塊元素
<div id="navbar" class="navbar navbar-inverse navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<h1><a class="brand" id="cf" href="#"><img class="bottom" src="hottdogg.png" data-min-width-481="hottdogg.png" alt="Tipit"><img class="top" src="hottdogg.png" data-min-width-481="hottdoggHover.png" alt="Tipit"></a></h1>
<nav class="nav-collapse collapse" role="navigation">
<h2 class="visuallyhidden">Navigation</h2>
<ul class="nav">
<li class="active"><a href="#home">Home</a></li>
<li><a href="#recent-work">Recent work</a></li>
<li class="divider"></li>
<li style="margin-left:20px"><a href="#about-us">About us</a></li>
<li><a href="#contact-us">Contact us</a></li>
</ul>
</nav>
</div>
</div>
</div>
而CSS:
#navbar .nav {
font-size: 0;
text-align: center;
white-space: nowrap;
float: none;
margin: 0;
}
#navbar .nav li {
display: inline-block;
float: none;
}
#navbar .nav a {
margin-bottom: 0;
font-size: 16px;
line-height: 37px;
height: 37px;
padding-left: 1.4em;
padding-right: 1.4em;
}
#navbar .divider {
width: 186px;
}
不爲我的目的。 「近期工作」和分隔線之間存在不必要的空間 – 2014-10-18 08:48:31