Адаптивная верстка на bootstrap?

Question

[Evgeniy V.]

Добрый день. Делаю сайт (лендинг), сверстал все, но теперь нужно сделать адаптивную верстку, потому что сайт распадается при ширине меньше 1024px. Подскажите уроки (желательно видео) или что-то подобное. Сам искал, но показывают просто верстку, а не саму адаптацию

Answer 1

[Роман Мисюра]

Соглашусь с ораторами выше. Доки по бутстрапу.
По сетке - суть в класах (xs, md, sm, xl, lg) - каждый клас даст свои размеры для адаптивности.
Например

<div class="col-lg-6 col-md-10"></div>
<div class="col-lg-6 col-md-2"></div>
<div class="col-lg-12 col-md-6 col-md-offset-6"></div>

На десктопе - 2 колонки в ряд, 3я колонка под ними.
При адаптиве под другое расширение экрана - 1я колонка будет шириной в 10 колонок, 2я в 2 (они будут стоять в ряд). 3я колонка будет шириной 6 и отступать слева на 3. Можете написать в скайп или вк, обьясню поподробнее, а так читать доки.

Answer 2

[Shad30]

https://www.youtube.com/channel/UC7enHM_oJRYJOnyJr...
Вот тут смотри, верстает с помощью сетки бутстрап адаптивно

Answer 3

[Alexander Pushkarev]

Показывают так, потому что верстают сразу адаптивно, а не так как вы хотите. Перевёрстывайте нормально сразу с сеткой

Comments

[Evgeniy V.]

все сверстано под сетку md

Answer 4

[Егор Живагин]

Именно бутстрап?
По нему всё очень понятно в доках, гугли: bootstrap grid

По другим стилям гуглить: css @media

Я бы скинул видеоуроки, но не смотрел их ни разу)) Это очень простая тема, чтения хватит

Comments

[Evgeniy V.]

Тогда помогите советом пожалуйста у меня при адаптации (прописывал media и выставлял колонки (xs md sm) но весь сайт как будто расположен в 8 из 12 колонок (то есть он весь справа имеет большой отступ)

[Егор Живагин]

Evgeniy V.: вы чтоль адрес дайте сайта или на codepen положите код