Сайт, разработанный для мониторов "нормального" размера, запутывается в широкоэкранном режиме. - PullRequest
2 голосов
/ 09 марта 2011

Я создал веб-сайт, который работает довольно хорошо, но позже перешел в дом друга, и этот сайт был непропорциональным и почти отвратительным на его широкоэкранном мониторе. Без обширного переписывания веб-сайта, возможно, существует сценарий, который изменяет размеры моего веб-сайта для тех, которые используются на широкоэкранных мониторах, или другие альтернативы? Любые предложения, кроме "переделать свой сайт должным образом" приветствуются. Спасибо!


EDIT: Вот как должен выглядеть мой сайт: http://img843.imageshack.us/img843/4453/22425853.jpg
Вот как это выглядит на широкоформатном экране: http://img851.imageshack.us/img851/7494/racism.jpg

Ответы [ 2 ]

4 голосов
/ 09 марта 2011

Зависит от того, как вы сделали макет. Если вы не использовали абсолютное или фиксированное позиционирование, самым простым способом может быть использование div-оболочки вокруг вашего контента и придание ему максимальной ширины, как это

<body>
    <div id="wrapper">
        <!-- all the content goes here -->
    </div>
</body>

и CSS

#wrapper {
    max-width: 960px;
    margin: 0 auto
}

РЕДАКТИРОВАТЬ : если у вас нет доступа к HTML, вы можете оставить CSS, как показано, и использовать эту строку jQuery (она должна работать, но я ее не тестировал)

$('body').wrapInner('<div id="wrapper" />')

РЕДАКТИРОВАТЬ : Я вижу, вы не знакомы с JQuery. Код, который должен запускаться только тогда, когда страница готова, должен быть упакован следующим образом:

$(function() {
    $('body').wrapInner('<div id="wrapper" />');
});

Пожалуйста, дайте мне знать, если это работает для вас. Вы можете попробовать

$('#wrapper').attr('id');

в консоли Firebug, чтобы проверить, что div оболочки был создан.

0 голосов
/ 09 марта 2011

Установите max-width в вашем CSS на оболочке сайта.

...