Как избавиться от горизонтальной полосы прокрутки внизу?

Пожалуйста, взгляните на this.Как избавиться от горизонтальной полосы прокрутки внизу?

Я попытался настроить свойства переполнения и изменить ширину изображений, но полоса прокрутки остается внизу экрана.

Кто-нибудь знает, что вызывает это и как остановить это?

2012-02-13 imjp

Проблема в вашем определении .slideshow (style.css: 199 ...).

Браузер пытается решить формулу:

left 
+ margin-left 
+ border-left-width 
+ padding-left 
+ width 
+ padding-right 
+ border-right-width 
+ margin-right 
+ right 
= parent width

и терпит неудачу, потому что left составляет 50%, а width составляет 100%. Ваше использование margin:-800px не поможет на устройстве с шириной отображения 1920 пикселей, так как (1920 * 1,5 - 800) составляет 2080 и, следовательно, слишком широким для устройства такого размера.

Используйте вместо этого следующее определение, поскольку оно будет подразумевать создание элемента с width из 100%.

.slideshow{ 
    z-index: -9999; 
    position: absolute; 
    top: 0; 
    left: 0; 
    right: 0; 
}

См. Также CSS Positioned Layout Module Level 3: Section 7.1. Имейте в виду, что даже если вы используете описанную выше технику, пользователи с шириной отображения менее 1024 пикселей будут иметь полосу прокрутки. Для этого вопроса попробуйте body{overflow-x:hidden;}.

Ваш старый код (не используйте его только для завершения!):

.slideshow{ 
    z-index: -9999; 
    position: absolute; 
    top: 0; 
    left: 50%; 
    width: 100% !important; 
    margin-left: -800px; 
}

источник

2012-02-13 20:53:26 Zeta

** Наконец кто-то получает до первопричины ** +1 ... возможно, также покажет правило CSS в строке 199. Это беспорядок ... 'left: 50%; margin-left: -800px; и т. д. Если вы обнаружите, что используете огромные отрицательные поля, чтобы компенсировать что-то еще, возможно, оригинальный метод необходимо пересмотреть с нуля. – Sparky

@ Sparky672: Включен старый код, а также добавлено немного объяснений. Я действительно не знаю, почему так много людей пытаются использовать слишком простые хаки (без обид для вас, ребята), когда проблема явно где-то между хрупкими строками того, что может быть ценным кодом css ... – Zeta

Я думаю, что это всегда лучше знать _why_ вам нужно что-то сделать, а не этот общий подход к сбросу всех правил CSS и скрытию переполнения. Серьезно, подумайте об этом ... вы по существу «перезагружаете» CSS по умолчанию каждый раз, когда вы применяете свое собственное правило. Смешно применять «margin: 0;' to 'p», когда три строки позже, вы применяете только свой запас к 'p'. – Sparky

Это должно избавиться от него, просто попробовали в devtools.

body { overflow-x: hidden; }

источник

2012-02-13 20:43:32 elclanrs

overflow-x:hidden; 
overflow-y:auto;

должны это сделать.

или быть на безопасной стороне, чтобы охватить браузеры, которые могут не поддерживать, что:

overflow:auto; 
overflow-x:hidden;

источник

2012-02-13 20:43:53

Да, это в основном решает эту проблему =) – imjp

Вы можете сделать, как сказал г-н Pallazzo, но это будет отсекать все содержимое на правой стороне (т.е. вам теперь нужно прокрутить, чтобы увидеть), которого вы, вероятно, не хотите. Пожалуйста, взгляните лучше на спецификации ширины разделителей обертки и т. Д. Ваш div под названием wraper имеет width, установленный как 1003px. Лучше всего не устанавливать размеры в таких абсолютных выражениях, а вместо этого использовать проценты.

источник

2012-02-13 20:48:38

Как избавиться от горизонтальной полосы прокрутки внизу?

ответ

Смежные вопросы