html - 放置在 anchor 标记中的图像上方的奇怪间距

Question

我在顶部菜单正下方的页面顶部放置了一个大横幅，上面放置了一个链接。检查以下链接。

http://dev.shy7lo.com/shoes.html?___store=en&___from_store=arabic

如果您在 firebug 或 Chrome 开发者工具中检查图像上方的间距，a 标签会增加大约 17 到 20 像素的额外顶部空间。这很奇怪。任何人都可以建议为什么会有这个间距以及如何删除它？

Answer 1

因为

 .main-container {
   padding: 30px 30px 0;
 }

你应该把它替换成

.main-container {
  padding: 0 30px; 
} 

并在#header-search

中制作 height:0px

@media only screen and (min-width: 771px)
#header-search {
    display: block;
    position: relative;
    top: -48px;
    float: right;
    width: 25%;
    /*height: 50px;*/
    height: 0;
    padding: 0;
}