← Комьюнити

Bootstrap 3, урок 2. какая таблица имеется ввиду?

Миронов Остап8 ответов
#bootstrap

Скажите, пожалуйста, какую таблицу имеет ввиду Сергей в данном уроке?

В моем браузере (Chrome) в инструментах разработчика нет никаких записей об изменяющейся ширине container при изменении ширины экрана. Когда физически меняю ширину экрана, container постепенно становится во всю ширину без отступов. 

Код у меня в инструментах разработчика выглядит так:

element.style {
    background-color: red;
    height: 100px;
}

.container {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

и т.д.

В чем ошибка? Что я неправильно понял/сделал; как можно исправить?

Спасибо.

8 ответов

В видео таблица есть и здесь:

https://getbootstrap.com/docs/3.4/css/#grid-options

student_cX4p_FA9

student_cX4p_FA9, я имел ввиду где в моих файлах находится эта таблица или ссылка на нее; почему в браузере не отображаются эти данные?

 

Миронов Остап

Там говорится про два класса: container и container-fluid. Просто container - это с отступами, container-fluid - это блок, растянутый на всю длину. В браузере меняются свойства в медиа запросах container, если менять размер браузера. 

student_cX4p_FA9

Суть урока мне совершенно понятна. Мой вопрос: почему в моем браузере Chrome не меняются свойства в медиа запросах container при изменении размера браузера.

Миронов Остап

У меня меняется в хроме media container. При маленьком размере браузера:

@media (min-width: 768px)
.container {
    width: 750px;
}

При увеличении размера chrome:

@media (min-width: 992px)
.container {
    width: 970px;
}

И так далее.

student_cX4p_FA9

А у меня, как я писал в стартпосте, контейнер в инструментах разработчика выглядит так:

.container {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}
Миронов Остап

У меня тоже есть стили container, но нужно выше смотреть в css медиа запросах:

@media (min-width: 992px)
.container {
    width: 970px;
}

.container {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}
student_cX4p_FA9

Так я же об этом и говорю, что у меня их нет. И спрашивал, почему их нет, где их искать и как подключить.

В общем я в данный момент разобрался. Файл .css, содержащий медиа-запросы, скачанный с сайта bootstrap, полностью закомментирован. Поэтому я подключил файл .css через CDN, и медиа-запросы появились.

Миронов Остап

Ваш ответ

Войдите, чтобы ответить
Bootstrap 3, урок 2. какая таблица имеется ввиду? — FructCode | FructCode