CSS Bootstrap，你能禁用显示弹性吗？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/35086619/
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
Bootstrap, can you disable display flex?
提问by Bomber
I have the following css thats breaking my layouts:
我有以下 css 破坏了我的布局：
@media (min-width: 768px)
.row {
display: flex;
}
Can I disable the display flex rule? Can anyone explain why this happens?
我可以禁用显示弹性规则吗？谁能解释为什么会发生这种情况？
Update:
更新：
Currently using boostrap-sass, "bootstrap-sass": "~3.3.5" Cant find the line in my sass files, probably not much help but it appears here in my compiled css:
当前使用boostrap-sass， "bootstrap-sass": "~3.3.5" 在我的 sass 文件中找不到该行，可能没有太大帮助，但它出现在我编译的 css 中：
strong {
font-weight: 600; }
.wrapper {
padding: 50px 20px; }
// row class here
**@media (min-width: 768px) {
.row {
display: flex; } }**
@media (min-width: 768px) {
.column {
width: 50%; }
.column:first-child {
margin-right: 20px; } }
.modal__button {
margin-right: 5px; }
@media (max-width: 500px) {
.modal-dialog {
width: 100%;
margin: 10px auto; } }
.week-navigation {
float: right; }
.week-navigation__next-button {
float: right; }
回答by Joao Almeida
CSS display property has several possible values. One of them, and the most recent, is flex. A HTML element with flex will automatically apply default properties to its children elements. You can check the following url to understand how flex works https://css-tricks.com/snippets/css/a-guide-to-flexbox/So, if you don't want to use it, just override it, by using
CSS display 属性有几个可能的值。其中之一，也是最新的，是 flex。带有 flex 的 HTML 元素将自动将默认属性应用于其子元素。您可以查看以下网址以了解 flex 的工作原理https://css-tricks.com/snippets/css/a-guide-to-flexbox/所以，如果您不想使用它，只需覆盖它，通过使用
@media (min-width: 768px)
.row {
display: block;
}
for example.
例如。
回答by Dmidify
Can you tell me a little more about where this following block of CSS is located? What version of bootstrap are you running as well? It may be something as simple as changing a boolean from true to false and then recompiling the SCSS that bootstrap 4 (assuming that is the version you are using) provides.
你能告诉我更多关于下面这个 CSS 块的位置吗？您还运行什么版本的引导程序？它可能就像将布尔值从 true 更改为 false 然后重新编译 bootstrap 4（假设这是您正在使用的版本）提供的 SCSS 一样简单。
If you are using an older version of bootstrap, then you have a library, or CSS you wrote yourself that is overwriting. I am leaning that your issue is being caused by the prior assumption.
如果您使用的是旧版本的引导程序，那么您有一个库或您自己编写的 CSS 会被覆盖。我倾向于您的问题是由先前的假设引起的。
If you have SASS installed on your computer already and are familiar with it as well, then this is easy. Locate the _variables.scss file that is included with bootstrap and inside of it you will find the following property:
如果您的计算机上已经安装了 SASS 并且对它很熟悉，那么这很容易。找到包含在 bootstrap 中的 _variables.scss 文件，您会在其中找到以下属性：
$enable-flex: true !default;
You want to change this to:
您想将其更改为：
$enable-flex: false !default;
After you have done this, recompile bootstraps the SCSS and you will then have disabled flex throughout the entire bootstrap framework.
完成此操作后，重新编译引导程序 SCSS，然后您将在整个引导程序框架中禁用 flex。
回答by Tobias Ernst
Bootstrap 4:
引导程序 4：
div.row {
display: block;
width: 100%;
...
}
dov.row div.col {
width: 100%;
max-width: 100%;
...
}
