Note that there are some explanatory texts on larger screens.

plurals
  1. POgeneral container - IE8 horizontal scrollbar problem
    text
    copied!<p>I ran into the following problem:<br> how to make a general container (HTML + CSS; no javascript)<br> that is contrained vertically (it has a fixed outer height), so it may have a vertical scrollbar<br> but that can grow horizontally (as needed by the content of the container), so it never has a horizontal scrollbar </p> <p>it has to work in IE8, FF, Chrome (no IE7 or earlier)</p> <p>the solution semms to be be trivial at first<br> but I can not get rid of the horizontal scrollbar in IE8:</p> <pre><code>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"&gt; &lt;html&gt; &lt;body&gt; &lt;div style="display: table;" class="container-div-1"&gt; &lt;div style="display: table-cell;" class="container-div-2"&gt; &lt;div style="overflow-y: scroll; height: 19em;" class="container-div-3"&gt; &lt;div style="width: 30em; height: 30em; background-color: red;" class="example-content"&gt;&lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>in this example, we need a 19em high container, that can grow horizontally, as needed by the content (in this case, the "example-cotent" div)<br> please don't suggest to modify the "example-content" div, as it is just a sample content (any content could be there)</p> <p>this problem is the generalization of this issue: <a href="https://stackoverflow.com/questions/5546454/ie8-horizontal-scrollbar-problem">IE8 horizontal scrollbar problem</a></p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload