Я новичок в Boostrap и нахожусь в таком месте, откуда не могу уйти... Я пробовал много всего, проверял документацию Boostrap и т. д., но мне нужна помощь.
У меня есть следующий код:
[*] #wrapper {фон: желтый; максимальная ширина: 500 пикселей; маржа: 0 авто; } .info {фон: синий;} #side {фон: красный} #data {фон: оранжевый;} Панировочные сухари
...
Информация
информация
... ... ...
- ...
- ...
- ...
- ...
Проблема в том, что #breadcrumbs, h1, .info имеют любую ширину (максимальная ширина их оболочки, скажем, 1600 пикселей), но .row больше. Он имеет отрицательное левое/правое поле, взятое из _grid.scss:6.
Когда я устанавливаю цвет фона для элемента #side, он визуально выходит за пределы сетки.
Есть идеи, что я делаю не так?
Спасибо.
Я пытался проверить руководство по Bootstrap, изменить имена классов начальной загрузки и т. д. Я ожидаю, что вложенная строка будет иметь ширину, равную 100 % ее родительской.
Прилагаю изображение/скриншот, как это выглядит. Вверху виден p.info (его границы), внизу .row с красным фоном, выходящий за пределы .info и их родителя.
скриншот
Ссылка на JSFiddle: https://jsfiddle.net/e3fxnthp/
Мобильная версия