@YellowFellow

Как сверстать макет, ширина которого больше, чем ширина экрана моего монитора?

Здравствуйте, хотел сверстать страничку, но столкнулся с проблемой. Ширина моего монитора 1600px, а ширина макета 1920px. Как быть в такой ситуации? Верстать всё по размерам макета? Но тогда ведь появится горизонтальная полоса прокрутки.
Макет
  • Вопрос задан
  • 554 просмотра
Решения вопроса 3
Vlad_IT
@Vlad_IT Куратор тега CSS
Front-end разработчик
1) Купить нормальный fullhd монитор, т.к. сейчас все сайты нужно на нем смотреть.
2) В хроме F12, слева кнопочка Toggle device toolbar, и вверху вводите нужную ширину экрана.
Ответ написан
Ankhena
@Ankhena Куратор тега CSS
Нежно люблю верстку
Не скачивала полный макет, а только смотрела превью, но ширина макета у вас не 1920. Это только дизайнер показал, как все должно выглядеть, например, на 1920.
Посмотрите внимательно: есть фиксированная контентная ширина, а все что выходит за нее должно быть растянуто на всю ширину окна браузера, любую.

Так что на 1600 (да и на 1200 тоже) у вас не должно быть никакой горизонтальной полосы прокрутки.
Ответ написан
ThunderCat
@ThunderCat
{PHP, MySql, HTML, JS, CSS} developer
Хинт: ctrl + клавиша минус(или ролик скролл вниз) уменьшает ваш большой макет и прокрутки не будет, или задайте адаптивную ширину/высоту через тулбар хрома, как написал Владимир Проскурин .
Ответ написан
Пригласить эксперта
Ответы на вопрос 4
@DanKud
А причем здесь ваш монитор и другие? Вы что только для себя хотите сверстать страницу? :)
Используйте панель разработчика SHIFT + CTRL + I и задавайте нужное расширение для тестов. А для верстки прописывайте в стилях ширину/высоту в процентах. Используйте медиа-запросы для задания стиля в зависимости от расширения монитора. Да и просто для начала загуглите - адаптивная верстка
Ответ написан
aliencash
@aliencash
Партизан
Можно покопаться в настройках видеокарты. Например у меня nvidia + монитор 1920х1200. Я могу в настройках видяхи создать пользовательское разрешение 3520х2200 и это сработает.

ps: Хотя конечно интерполяция пикселов убьет качество...

pps: Еще вариант в браузере менять масштаб - зажать ctrl и крутить колесо мыши...
Ответ написан
Использовать инструменты разработчика в браузере как советовали выше. По максимуму использовать свойства min-... max-.. calc, резиновая верстка наше все в мире где куча устройств с кучей разных разрешений.
Ответ написан
warsand
@warsand
Экспериментатор
Если у макета body {width: 100%;}, то ширина макета адаптируется под окно браузера.
Если надо у́же и не в процентах, то body {width: 80vw;}
Если надо шире, чем браузер любого клиента, то:
body {width: 120%;} или body {width: 120vw;} соответственно.
- И да, ширину "чилдров" макета желательно будет "опроцентовать" тоже
(как-то так...)))
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы