I’m trying to get a simple table layout, with the following basic requirements:
- It must stretch to 100% height
- It if content exceeds 100% of the viewport, then a scroll bar should be displayed.
This example code in this JSFiddle works fine in webkit, however in Firefox, etc. it appears that its not translating correctly.
Any help would be very much appreciated.
Percentage based dimensions (width and height) don’t work with
overflow:autoin Mozilla or IE.The layout engine must already know what the height of the element is before it can apply an
overflow:autoto the element.Hence
.scrollable { background: red; height:700px; overflow: auto; }will work fine in Mozilla and IE (700px being some arbitrary value).