разные прокладки по бокам на видовом экране ниже 768px

SELECT * FROM Table_Name LIMIT 5;
0
задан MK-DK 13 July 2018 в 06:30
поделиться

4 ответа

.row>[class*="col-"] ищет любой class="col- в прямом потомке .row, ваш HTML не структурирован так. Поэтому удалите >

 .row [class*="col-"] {
      padding-left: 5px;
      padding-right: 5px;
  }

Или вы также можете установить .container [class*="col-"]

0
ответ дан caiovisk 17 August 2018 в 13:32
поделиться
  • 1
    Это решение проблемы, спасибо. Я исхожу из неправильного пути, связанного с использованием платформы bootstrap? Я боюсь делать какие-то вещи или взламывать себя через решение. Я хотел бы как можно больше прислониться к структуре бутстрапа. – MK-DK 13 July 2018 в 06:46
  • 2
    Bootstrap - довольно хороший инструментарий, когда вы действительно понимаете его структуру. Поэтому документация - лучшее место для изучения, getbootstrap.com/docs/4.0/layout/grid ... Не забудьте установить правильный ответ. – caiovisk 13 July 2018 в 06:51

Вы должны использовать классы начальной загрузки для всех размеров экрана, если вы используете class="col-sm-8" только для средних экранов, правильное использование:

<div class="col-lg-8 col-md-8 col-sm-8 col-xs-12">
</div>
1
ответ дан Jorge Bowen 17 August 2018 в 13:32
поделиться
  • 1
    Благодарим за ваше предложение. Все еще не работает, так что на карте должно быть какое-то пользовательское css, вызывающее проблему? – MK-DK 13 July 2018 в 06:40
  • 2
    Mmmm изменить положение строки div, должно быть родителем любого col – Jorge Bowen 13 July 2018 в 06:43
  • 3
    Удалить свой собственный css – Jorge Bowen 13 July 2018 в 06:43
  • 4
    И добавьте это мета: & lt; meta name = & quot; viewport & quot; content = "width = device-width, user-scaleable = no, initial-scale = 1.0, maximum-scale = 1.0, minimum-scale = 1.0" & gt; & gt; – Jorge Bowen 13 July 2018 в 06:44
  • 5
    Есть ли особая причина, по которой я должен использовать строку <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">? Какая разница по сравнению с тем, как пишет сценарий бутстрапа: <meta name="viewport" content="width=device-width, initial-scale=1">? – MK-DK 13 July 2018 в 06:49

Почему вы не используете классы Bootstrap grid ? Тогда пользовательский CSS не требуется.

<div class="col-sm-12 col-md-12 col-xs-12">
</div>
1
ответ дан juzraai 17 August 2018 в 13:32
поделиться

JUST ADD !important, если вы хотите применить одно и то же дополнение. также удалите > из вашего CSS.

@media only screen and (max-width: 768px) {
        .row {
          margin-left: -5px !important;
          margin-right: -5px !important;
        }
        .row [class*="col-"] {
          padding-left: 5px !important;
          padding-right: 5px !important;
        }

    }
2
ответ дан Tashi Jutt 17 August 2018 в 13:32
поделиться