Блог

У меня странная проблема, которая, вероятно, больше связана с плохим кодированием, чем с чем-либо еще.

В принципе, у меня есть этот сайт, где, если вы измените размер своего браузера примерно на размер веб-сайта, вы увидите, что вы можете прокручивать вправо. Это потому, что у меня есть <div> с position: absolute правой стороны сайта с шириной и высотой, которые, кажется, «выталкивают» сайт за пределы окна, и если вы прокрутите страницу, вы увидите, что верхняя часть сайта не соответствует моему width:100% .

Если вы понимаете мое объяснение, не могли бы вы сказать мне, как правильно это закодировать?

Добавьте overflow-x: hidden; к идентификатору тела в css

это хороший способ скрыть эту полосу прокрутки и отложить эти изображения в сторону. ваш основной css будет выглядеть следующим образом

 body{
    font-family:Arial, Helvetica, sans-serif;
    font-size:13px;
    margin:0;
    padding:0;
    background-image: url(images/bckpattern.gif);
    background-repeat: repeat;
    overflow-x: hidden;
}
  

Некоторый видовой экран определения = прямоугольник браузера, в котором отображается страница

Причина, по которой ваша верхняя часть «не учитывает» ширину: 100%, заключается в том, что при абсолютном позиционировании элемента он полностью удаляется из потока. Это означает, что у div #bcktop нет возможности узнать, что справа больше содержимого.

Когда вы говорите «ширина: 100%» для элемента, родительским элементом которого является body, вы говорите «Установите ширину, равную ширине окна просмотра»

Ответ от rmagnum2002 — это грязный, но быстрый способ решить вашу проблему, поскольку он просто скрывает проблему. А как насчет пользователей, у которых экраны меньше? они не смогут использовать эту область страницы (я предполагаю, что sbi_right будет использоваться в будущем)

Вместо этого я рекомендую следующее исправление: Установите свойство min-width для ваших горизонтальных полос, чтобы, когда пользователь изменяет размер своего браузера (или когда его экран недостаточно большой), эти полосы по-прежнему будут занимать всю страницу.

Вот пример:

 <div id="annoncetop" style="min-width:MAX_WIDTH_OF_PAGE_CONTENT">