几天来,我一直在为这个问题苦苦挣扎,我尝试更改 CSS 文档中所有可能的属性,但它们似乎都不起作用。
网站:http ://www.mohrdevelopment.com
问题出在导航栏中。
问题:我要删除的每个按钮之间都有一个间距/间隙
问题:当鼠标悬停在导航栏的背景上时,所有按钮(除了主页按钮)都会展开以超出导航栏的背景。导航栏的高度为 40px。
这是我对栏的 HTML 编码:
<div class="wrap">
<ul class="navigation">
<li class="current"><a href="index.html"><em class="home"/><b>Home</b></a></li>
<li><a href="second.html"><em class="photos"/><b>Photos</b></a></li>
<li><a href="projects.html"><em class="projects"/><b>Projects</b></a></li>
<li><a href="about.html"><em class="about"/><b>About</b></a></li>
<li><a href="contact.html"><em class="contact"/><b>Contact</b></a></li>
</ul>
这是我的 CSS 代码:
body {
font-family:sans-serif;
background: url(images/background3.png);
}
.navigation {
background:#1841c8 url(Navigation/Navigation/nav_background.png);
height:40px;
margin-bottom:0px;
display:block;
min-width:625px;
}
.navigation li{
display:inline-block;
line-height: 40px;
}
.navigation li a{
color:#FFFFFF;
padding: 11px 5px 15px;
}
.navigation li a em{
height:32px;
display:inline-block;
padding: 0 5px 6px 50px;
font-weight:bold;
vertical-align: middle;
background-position: 0 50%;
}
.navigation li a:hover{
color:#00CCFF;
background: url(Navigation/Navigation/nav_hover.png);
text-decoration:none;
padding: 11px 5px 10px;
}
.navigation .current a {
color:#FFFFFF;
background:url(Navigation/Navigation/nav_hover.png);
padding-bottom:11px;
}
/*Navigation bar icons*/
.navigation li a em.home {
background-image: url(Navigation/Icon_images/home.png);
background-repeat: no-repeat;
}
.navigation li a em.photos{
background-image: url(Navigation/Icon_images/Photo.png);
background-repeat: no-repeat;
}
.navigation li a em.projects{
background-image: url(Navigation/Icon_images/projects.png);
background-repeat: no-repeat;
}
.navigation li a em.about{
background-image: url(Navigation/Icon_images/about.png);
background-repeat: no-repeat;
}
.navigation li a em.contact{
background-image: url(Navigation/Icon_images/Contact.png);
background-repeat: no-repeat;
}
.wrap {
margin:auto;
width:80%;
background:yellow;
}
希望有人可以帮助我解决这个问题,我已经花了几个小时对其进行故障排除/寻找解决方案。