Html 菜单和垂直导航栏之间的额外空间
我正在使用bootstrap编写网站,在垂直导航栏和网站菜单之间获得了额外的空间。它在大屏幕上就像+/-10px,但因为它有一个水平条。 我的代码:Html 菜单和垂直导航栏之间的额外空间,html,css,bootstrap-4,Html,Css,Bootstrap 4,我正在使用bootstrap编写网站,在垂直导航栏和网站菜单之间获得了额外的空间。它在大屏幕上就像+/-10px,但因为它有一个水平条。 我的代码: <header> <div class="col-sm-8 offset-sm-2"> <a href="logo"><img src="logo.png" width="100%"/></a> </div> <nav>
<header>
<div class="col-sm-8 offset-sm-2">
<a href="logo"><img src="logo.png" width="100%"/></a>
</div>
<nav>
<ul class="menu col-sm-12">
<li><a href="start"><i class="icon-users"></i> About us</a></li>
<li><a href="out-products"><i class="icon-leanpub"></i> Products</a></li>
<li><a href="contact"><i class="icon-mail-alt"></i> Contact</a></li>
</ul>
</nav>
</header>
有人知道怎么解决这个问题吗 您的HTML中有一些错误,列应按如下方式排列:
<div class="row">
<div class="col-8">
<p> My content </p>
</div>
<div class="col-4">
<p> My other content </p>
</div>
</div>
你可以发布输出吗?当然可以使用这个,宽度:100%,我尝试了宽度:100%,但它也没有帮助。还要尝试标题标记谢谢你的帖子,但我的意思是删除这个空间,填充顶部对它没有任何作用
.menu
{
list-style-type: none;
padding-top: 0; // do not add padding to top
padding-bottom: 8px;
padding-left: 0px;
padding-right: 0px;
margin: 0px;
font-size: 20px;
min-height: 30px;
line-height: 150%;
letter-spacing: 1px;
background: linear-gradient(to top, rgba(165,160,160,1), rgba(0,0,0,0));
}