Bootstrap导航药丸之间有额外的空白空间

这是一个简单的自举代码，我正在尝试，其中浮动块单元之间有额外的空间。我如何删除它，为什么它在那里？Bootstrap导航药丸之间有额外的空白空间

<ul class="nav nav-pills"> 
    <li style="width: 40%; background: #8ac1dc;" class="active"> 
    <a href="#ap-about" data-toggle="tab" aria-expanded="true">About</a> 
    </li> 
    <li style="width: 40%; background: #ff6666"> 
    <a href="#ap-personal" data-toggle="tab">Account</a> 
    </li> 
</ul>

Jsfiddle

来源

2017-07-03 StudentX

如果你问abt空间beetween锚文本和导航那么你可以从左侧删除填充锚标记 – CyberAbhay

删除保证金

CSS

.nav-pills>li+li{ 
    margin:0px; 
}

来源

2017-07-03 06:14:25

试试这个： -

<ul class="nav nav-pills"> 
    <li style="width: 40%; background: #8ac1dc;" class="active"> 
    <a href="#ap-about" data-toggle="tab" aria-expanded="true" style="border-radius: 0;">About</a> 
    </li> 
<!-- --> 
<li style="width: 40%; background: #ff6666;margin:0"> 
    <a href="#ap-personal" data-toggle="tab" style="border-radius: 0;">Account</a> 
</li> 
</ul>

来源

2017-07-03 06:14:17 noobcode

转到您的bootstrap.css文件上线4093和编辑的2px 0

.nav-pills > li + li { 
    margin-left: 0; 
}

来源

2017-07-03 06:15:16

它不是一个好主意，编辑该文件 – CyberAbhay

但通过这样做，它会解决他的问题，在每一页。他不需要重复做同样的工作。 –

如果需要在多个页面中，则他可以添加带重要标记的自定义样式文件。 – CyberAbhay

Update the bootstrap.css margin-left from 2px to 0px 
.nav-pills > li + li { 
    margin-left: 0px; 
}

来源

2017-07-03 06:19:39

添加自定义类在UL像my-nav-pills

，并添加CSS像下面

.my-nav-pills li{ 
    margin-left:0px; 
}

是连击覆盖引导类和不改变默认引导类的CSS。

来源

2017-07-03 06:20:11

Bootstrap导航药丸之间有额外的空白空间

回答

相关问题