1

I'm having an issue where I have a dynamically built table inside of a parent div.

I have set the parent div with a max-height but the if the table is larger then the div the table completely ignores the max-height of it's parent div and overflows over the page

The following is the CSS for the table:

#navigator_table
{   
table-layout: fixed;
font-family: Arial;
font-size: 10px;
margin: 5px 5px;
text-align: center;
border-collapse: collapse;
border: 1px solid #000;
Width: 95%;
}

The following is the CSS for the div:

.navigator_overflow
{
max-width: 650px;
height: expression(this.scrollHeight > 599 ? "600px" : "auto");
max-height: 600px;
overflow: scroll;
   }

I have tried any adding the following to no result in both the div and the table: 

overflow: hidden, auto, scroll
clear: both; 
float: left;
display: block;

overflow hidden just removed the scroll bars, but the table still went outside the bounds of the page.

I have tried adding: 

height: expression(this.scrollHeight > 599 ? "600px" : "auto");
/* supposed to be the workaround for max-height in IE*/

to the table

max-height works great in Firefox and Chrome. It's just IE

I am using the following doctype:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">

Any help would be appreciated on this.

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
Joelle
  • 11
  • 1
  • 3

2 Answers2

0

See this related question: CSS expression to set height of div

Short answer, you'll be better off using JavaScript for this...

Community
  • 1
  • 1
Richard A.
  • 1,157
  • 1
  • 7
  • 18
  • I tried that option : _document.getElementById( 'navigator_overflow' ).style.maxHeight = '500px';_ for both the div and the table and it did not work – Joelle Feb 06 '13 at 21:51
0

finally found my answer!


I needed to add 

position: relative;

In the parent div

answer found in the following site:
http://net.tutsplus.com/tutorials/html-css-techniques/9-most-common-ie-bugs-and-how-to-fix-them/
now, if anybody can tell me why it works....

Joelle
  • 11
  • 1
  • 3