Как сделать так, чтобы сайт занимал всю ширину экрана всегда при ширине контейнеров 1920 пикселей?

Question

[Midoyan]

Допустим у нас есть сайт сверстанный для монитора 1920 пикселей. Как сделать так, чтобы на разных разрешениях (мобильный, планшет, ноутбук) он занимал 100% ширины экрана. То есть как бы адаптивности не будет в таком случае, сайт просто ресайзится и подгоняется под ширину экрана, а все элементы сжимаются. Вроде такую картинку можно наблюдать на старых сайтах, но вот как это реализовать - не знаю, поскольку сверстал с использованием bootstrap 4, мета тег viewport убрал, поставил для container - ширину 1920 пикселей фиксированную. Но вот на разных девайсах появляется скролл, а мне нужно чтобы сайт занимал 100% ширину девайса, за счет уменьшения элементов. Думаю вы поняли, что я хочу. Очень нужна помощь в этом вопросе. Спасибо! Пробовал еще такую вещь - не помогает.

Comments

[Andrew]

Допустим у нас есть сайт сверстанный для монитора 1920 пикселей. Как сделать так, чтобы на разных разрешениях (мобильный, планшет, ноутбук) он занимал 100% ширины экрана. То есть как бы адаптивности не будет в таком случае, сайт просто ресайзится и подгоняется под ширину экрана, а все элементы сжимаются.

Классы бутстрапа сделайте col-цифра и медиа запросы в CSS удалите. Ширину в процентах выставьте , по идее, всё должно просто scale'ться.

Answer 1

[Midoyan]

<meta name="viewport" content="width=1920">
Вот такую вещь пробовал - не помогло.

Answer 2

[tyzberd]

установите фиксированный viewport в 1920, контейнеру тоже min-width: 1920px.
классы используйте col-xs-*

Comments

[Midoyan]

<meta name="viewport" content="width=1920">
Вот так писал + min-width: 1920px - в обычном просмотре появляется скролл. Но вот когда нажимаю toggle device toolbar - то получается так, как нужно. Но в обычном просмотре скролл все равно...
Скинул ссылку на файлы сайта, посмотрите пожалуйста, если есть время, очень нужно мне срочно помощь...

[Midoyan]

https://drive.google.com/file/d/1sbsJhDU3dXCwCRh3D...

[tyzberd]

в обычном с ним ничего не поделать

[tyzberd]

Вроде такую картинку можно наблюдать на старых сайтах

Наверно просто резиновые сайты с шириной в процентах, высота не фиксированная.

[Никита Кит]

Midoyan, потому что ты сам скроллбар не учёл. И он везде разный. Вообще херовая это идея в >1900 задавать min-width. Как правило все родительские блоки лэйаутов на сайтах резиновые, а внутри каждого одинаковой ширины контейнер, ограничивающий контент внутри до 1000-1280-1540px итд.
Определи контейнеры через max-width, задай их родительским секциям резину в процентах и не нужно тут никаких min-width для боди. во viewport напиши значение из max-width контейнеров.
Так делают если нет адаптива, но чтоб можно было что-то понять на любых устройствах

Answer 3

[Виктор Таран]

conainer-fluid
И будет тебе счастье.
ТАк же есть в интернете кастомные сетки под 6 -8 разрешений вплоть до 4к