Question

我有以下css打破我的布局：

@media (min-width: 768px)
.row {
    display: flex;
}

我可以禁用显示屏固定规则吗？任何人都可以解释为什么会这样吗？

更新：

目前正在使用boostrap-sass，＆＃34; bootstrap-sass＆＃34;：＆＃34; ~3.3.5＆＃34; 无法在我的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; }

Answer 1

CSS显示属性有几个可能的值。其中一个，也是最近的一个是flex。具有flex的HTML元素将自动将默认属性应用于其子元素。您可以查看以下网址，了解flex的工作原理https://css-tricks.com/snippets/css/a-guide-to-flexbox/ 因此，如果您不想使用它，请使用

覆盖它

@media (min-width: 768px)
.row {
    display: block;
}

例如。

Answer 2

您能告诉我更多关于以下CSS块的位置吗？你运行的是什么版本的bootstrap？它可能就像将布尔值从true更改为false一样简单，然后重新编译引导程序4（假设您正在使用的版本）提供的SCSS。

如果您使用的是旧版本的bootstrap，那么您有一个库，或者您自己编写的覆盖的CSS。我认为你的问题是由先前的假设造成的。

如果您已经在计算机上安装了SASS并且也熟悉它，那么这很容易。找到bootstrap中包含的_variables.scss文件，在其中您将找到以下属性：

$enable-flex: true !default;

您想将其更改为：

$enable-flex: false !default;

完成此操作后，重新编译引导SCSS，然后您将在整个引导框架中禁用flex。

Answer 3

Bootstrap 4：

div.row {
    display: block;
    width: 100%;
    ...
}

dov.row div.col {
    width: 100%;
    max-width: 100%;
    ...
}

Bootstrap，你可以禁用显示flex吗？

3 个答案: