Проблема CSS - горизонтальная полоса прокрутки скрывает содержимое - PullRequest
Новая
       0

Проблема CSS - горизонтальная полоса прокрутки скрывает содержимое

5 голосов
/ 03 сентября 2011

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

<td class='messages'><div style='border:0px;padding:0px;width:100%;overflow-x:auto;background-color:#66C2FF;height:' class='messages'>
AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
</div>
</td>

Заранее спасибо!

Ответы [ 3 ]

5 голосов
/ 03 сентября 2011

Переместите ваш CSS во внешнюю таблицу стилей и используйте условный комментарий для таргетинга только на те браузеры, с которыми у вас возникли проблемы (я использовал IE7 ниже или равный, поскольку не могу реплицировать в IE8).Я добавил отступы внизу.

Живой пример: http://jsfiddle.net/tw16/Vx9HZ/

Поместите условный комментарий в <head> следующим образом: 

<head>
    <!--[if lte IE 7]>
        <style>div.messages {padding:0 0 22px;}</style>
    <![endif]-->
</head>

CSS: Перемещено во внешнюю таблицу стилей. 

div.messages {
    border:0px;
    padding:0 0 0;
    width:100%;
    overflow-x:auto;
    background-color:#66C2FF;
}

HTML: Удален стиль. 

<td class='messages'>
    <div class='messages'>AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
    </div>
</td>
2 голосов
/ 03 сентября 2011

Это работает для меня: 

<html>
  <body>
    <td class='messages'>
      <div style='border:0px;padding:0px;width:100%;overflow-x:auto;background-color:#66C2FF; height= 50PX; class=messages;'>
      AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
      </div>
   </td>
  </body>
</html>

Я указал height для div, который был достаточно большим, чтобы показать текст и полосу прокрутки. =) Надеюсь, это поможет.

2 голосов
/ 03 сентября 2011

Если я вас правильно понимаю, то следующее должно решить вашу проблему, и ВСЕГДА разбивайте строку, чтобы указать ширину, если она указана. Поместите это в свой стиль = "". 

word-wrap: break-word

PS. Кроме того, у вас есть «высота:» без указания высоты.

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

Нет похожих вопросов

...