Как предотвратить перекрытие содержимого полосами прокрутки?

у меня есть блок предварительно отформатированного кода (

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


overflow: auto;




однако в IE7 (возможно, в других версиях IE) полоса прокрутки перекрывает последнюю строку моего контента (что особенно раздражает, когда есть только одна строка контента).



Я пробовал решение, указанное здесь, но это не сработало.



единственное решение, которое работает для использовать



overflow: scroll;




который добавляет полосу прокрутки ко всем моим предварительно отформатированным разделам, что просто ужасно.



 Примечание: он отлично работает в Firefox 3 и Google Chrome.



обновление



Я нашел решение (см. Мой ответ), но если кто-то найдет способ не иметь уродливого заполнения в каждом предварительно отформатированном разделе в IE7, это было бы идеально.
11
css html internet-explorer internet-explorer-7

4 ответов

сразу после публикации вопроса я подумал о проверке, обработал ли stackoverflow это (что он и делает).

Я взглянул на таблицу и нашел это:

padding-bottom: 19px!ie7;

(ну, они используют 20px, но 19 выглядели лучше).

Он добавляет нижнее заполнение только для IE7, что делает каждый предварительно отформатированный раздел без полосы прокрутки немного странным из-за огромного заполнения, но, по крайней мере, я могу видеть содержимое (и это выглядит странно на stackoverflow слишком.)

Извините, что задал вопрос слишком быстро.

10

добавить "padding-bottom:20px" в тег pre

2

обернуть PRE на DIV С некоторыми дополнительными полями.

1

обернуть PRE на DIV и применить overflow: scroll; до DIV. Убедитесь, что вы используете либо <div style="overflow: scroll; width='...'; height='...';"> или назначить класс к div, чтобы убедиться, что не все из них получают прокрутки.

например, в моем блоге, я использую <div style="overflow: scroll; width: 100%;"> для небольших кусков кода, чтобы люди могли прокручивать по горизонтали и div будет расти до нужной высоты. Для более длинных частей я также назначаю высоту, чтобы уменьшить длину всей статьи; люди также могут прокручивать вертикально.

вы также можно попробовать <div style="overflow: scroll; overflow-y: hidden; width: 100%;"> чтобы получить только горизонтальную полосу прокрутки (а не оба, и один из них отключен). Может быть!--7--> тоже работает.

0