[英]Bootstrap 3 removes padding/margin when I break under 767px width
When you look at that pen: http://codepen.io/helloworld/pen/eNpBdb 当您看那支笔时: http : //codepen.io/helloworld/pen/eNpBdb
where I use bootstrap 3 css cdn attached. 我在这里使用bootstrap 3 CSS CDN。
<div class="container">
<div class="row">
<ul style="background:orange;" class="nav navbar-nav">
<li><a title="" href="http://test.com/en/deu/disclaimer/imprint.html" target="_self">disclaimer</a>
</li>
<li><a title="" href="http://test.com/en/deu/disclaimer/imprint.html#!/content=privacy" target="_self">Datenschutz</a>
</li>
<li><a title="" href="http://test.com/en/deu/disclaimer/site-map.html" target="_self">Sitemap</a>
</li>
<li><a title="" href="http://test.com/en/deu/disclaimer/contact.html" target="_self">Kontakt</a>
</li>
</ul>
</div>
When I resize my browser window to under 767px in width, why does the left margin/padding/space of the disclaimer hyperlink and all other 3 hyperlinks disappear? 当我将浏览器窗口的大小调整为小于767px时,为什么免责声明超链接和所有其他3个超链接的左侧边距/填充/空格消失了?
Who removes that space? 谁删除那个空间? I need them as it looks very bad on small devices.
我需要它们,因为在小型设备上看起来非常糟糕。
The row
class has row
类有
margin-left: -15px;
margin-right: -15px
The child column items have their own padding them. 子列项目有其自己的填充。
This is meant to line up with the container
that has 这意味着与排队
container
有
margin-left: 15px;
marign-right: 15px;
Solution: Remove the row
class, or use the column-xs-12
class for your child element. 解决方案:删除
row
类,或对您的子元素使用column-xs-12
类。
您正在使用“容器”,“行”,“导航”,“导航栏-导航”的类都是引导程序中的所有类,因为引导程序是为响应浏览器调整大小而构建的,因此它将尝试使较小的设备(电话)更容易使用,平板电脑等),可以通过在bootstrap include下添加自定义css文件并将某些属性设置为!important来克服。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.