Я столкнулся со следующей проблемой:
как сделать общий контейнер (HTML + CSS; без JavaScript)
который ограничен вертикально (имеет фиксированную внешнюю высоту), поэтому он может иметь вертикальную полосу прокрутки
но он может расти горизонтально (в зависимости от содержимого контейнера), поэтому у него никогда не будет горизонтальной полосы прокрутки
он должен работать в IE8, FF, Chrome (без IE7 и более ранних)
решение кажется на первый взгляд тривиальным
но я не могу избавиться от горизонтальной полосы прокрутки в IE8:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<body>
<div style="display: table;" class="container-div-1">
<div style="display: table-cell;" class="container-div-2">
<div style="overflow-y: scroll; height: 19em;" class="container-div-3">
<div style="width: 30em; height: 30em; background-color: red;" class="example-content"></div>
</div>
</div>
</div>
</body>
</html>
в этом примере нам нужен контейнер высотой 19em, который может расти горизонтально, в зависимости от содержимого (в данном случае, «example-cotent» div)
пожалуйста, не предлагайте изменять div "example-content", так как это просто пример контента (может быть любой контент)
эта проблема является обобщением этой проблемы:
Проблема горизонтальной полосы прокрутки в IE8