CSS 如何限制大型设备上的 Bootstrap 列宽
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/20470854/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to Limit Bootstrap Column Width on Large Devices
提问by Peter
I have the following divs that use Bootstrap 3.0 CSS:
我有以下使用 Bootstrap 3.0 CSS 的 div:
<div class="container">
<div class="row">
<div class="col-md-4">
...
</div>
<div class="col-md-4">
...
</div>
<div class="col-md-4">
...
</div>
</div>
</div>
While this looks and behaves the way I want on XS to medium-sized devices, the expanded columns on large devices (>1200px) ruin my design.
虽然这在 XS 到中型设备上的外观和行为都是我想要的,但大型设备 (>1200px) 上的扩展列破坏了我的设计。
Is there a way to stop bootstrap from expanding column width to 95px on large devices?
有没有办法阻止引导程序在大型设备上将列宽扩展到 95px?
回答by Cengiz
Limiting the container width to max container width for medium devices (970px) will do the trick:
将容器宽度限制为中等设备(970px)的最大容器宽度即可:
<div class="container" style="max-width: 970px;">
<div class="row">
<div class="col-md-4">
...
</div>
<div class="col-md-4">
...
</div>
<div class="col-md-4">
...
</div>
</div>
</div>