Уменьшение расстояния между столбцами для начальной загрузки

У меня возникает эта проблема, когда я пытаюсь уменьшить длину столбца только больших экранов. Для больших экранов, у меня есть класс Div, как так:Уменьшение расстояния между столбцами для начальной загрузки

<div class="col-lg-2 col-md-3 col-sm-3 col-xs-3" style="vertical-align: middle;>Selected Fields</div>

Но на больших экранах (когда col-lg-2 превалирует), кажется, если расстояние от слова Выбранные поля слишком много. Есть ли способ «жестко» определить размер столбца, когда мы имеем дело с большими экранами? Это пример того, как он выглядит, где недостаток изображения «Selected Fields» является виновником.

Как мы видим, выбранные поля очень далеки от изображения «Учетная запись: баланс счета». Кажется, что только для больших экранов я получаю эту проблему. Я попытался проследить по этой ссылке: https://scotch.io/bar-talk/bootstrap-3-tips-and-tricks-you-still-might-not-know, который был тем шкафом, который я мог найти, и добавил padding-right:0; и padding-left:0; в теге стиля, но, похоже, ничего не исправил: это только изменяет прописку внутри строки. Любая помощь приветствуется. Благодаря!

источник

2015-10-12 user1871869

пространство на левой стороне этой проблемы сНу? –

@NenadVracar - это расстояние в правой части слова «Избранные поля». – user1871869

Вы можете установить ширину этого div в медиа-запросах> 1200px. И в следующий раз предоставите свой код, чтобы вы могли получить более качественные ответы. –

Написать этот CSS в конце файла CSS или в отдельном файле queries.css, если вы создали один

@media (min-width: 1200px) { //Here you specify on what device width you want this css to apply. So this will be applied on >1200 width 
    .yourDiv { 
     width: 150px; //You will write your own data here of course :) 
    } 
}

источник

2015-10-12 21:54:06

Это больше Хозяйке, поскольку вопрос уже ответил на Ненада, однако это может сэкономить вам некоторое время в будущем, а также сохранить вашу разметку более краткими.

Размеры столбцов бутстрапа работают вверх, а это значит, что вам не нужно повторять размеры столбцов для каждой точки останова, если они не меняются.

Это означает, что ваши DIV классы столбцов:

<div class="col-lg-2 col-md-3 col-sm-3 col-xs-3">...</div>

может быть сокращено до:

<div class="col-lg-2 col-xs-3">...</div>

, как Col-мд и Col-см наследуют их размер от Col-хз.

Вы также забыли закрыть свой стиль тег:

... style="vertical-align: middle;">

источник

2015-10-13 06:10:58 Valency

Уменьшение расстояния между столбцами для начальной загрузки

ответ

Смежные вопросы