Вопрос о настройке сетки Bootstrap 3

Так что в основном я создаю сетку изображений с полным экраном, используя бутстрап 3. Я использовал контейнерную жидкость и соответствующие столбцы для определения ширины моих строк и точек останова. Каждый из столбцов содержит изображение пищи и использует класс col-lg-2 col-md-3 col-sm-4 col-xs-4

Я не хотел, чтобы между изображениями стоял желоб, поэтому я удалил левое и правое дополнение, назначенное классу столбцов, которое дает мне точный вид, который я хочу. Теперь, когда я изменяю размер сетки, все работает отлично. Однако между шириной экрана 950px и 980px изображения имеют сточную канавку между ними по вертикали. Я не уверен, что вызывает это. У кого-нибудь есть идея?

Я приложил несколько иллюстраций к иллюстрации вместе с

http://www.bootply.com/xXaaLRWKTL. Это происходит в этом примере вокруг точки разрыва экрана планшета. Измените размер окна и посмотрите, вы увидите, что желобок возвращается в точку останова

http://imgur.com/a/ACSwA

благодаря

1 ответ

В случае примера это из-за изображений.

У изображений есть класс img-responsive, который устанавливает свойство max-width: 100%. Поскольку эта максимальная ширина изображения составляет 320 пикселей, сами изображения останавливаются на 320 пикселей (фактический div действует так, как должен). Либо используйте большее изображение, либо удалите свойство max-width и установите width: 100%.

licensed under cc by-sa 3.0 with attribution.