i have a div inside table cell.
i want that div to take all cell's height so i set
height:100% for that div.
the problem is that ie ignores this and it streches div only according to its content
(firefox doing it ok)
Is it posssible to overcome this IE quirk?
height:100%; ie workaround needed
Moderator: General Moderators
Code: Select all
<body style="margin:0px; padding:0px;"><!-- style may be omitted in this tag if you want margins -->
<table style="height:100%;" border="2">
<tr><td rowspan="3">&nbsp;1</td> <td>&nbsp;2txt</td> <td style="width:100%;">&nbsp;3</td> </tr>
<tr><td>&nbsp;1</td> <td>&nbsp;2 txt txt</td> </tr>
<tr><td>&nbsp;1</td> <td>&nbsp;2</td> </tr>
</table>
</body>Code: Select all
andCode: Select all
tags where approriate when posting code. Read: [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url][/color]hi
i still didn't solved the problem with height but finally i found the cause of this.
below is ready to use code that demonsrates what happens in IE when DOCTYPE declaration is changed...
the first DOCTYPE in his code is what i use and why all above suggestions for fix don't work.(this DOCTYPE taken from
http://www.w3.org/QA/2002/04/valid-dtd-list.html)
The second DOCTYPE is something my editor generates automaticly and it is commented out in below code...
Now try the following:
ran the code below first time with first DOCTYPE and second time with second DOCTYPE and see how height:100% is affected...
So if i want height:100% to work i need to use second DOCTYPE
Can i make it to work with first DOCTYPE ?
thanks
what i found out afer submitting of this post is that if i use:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
then IE works in non-standarts mode and i don't want that
(it is equavalent to not specifying DOCTYPE at all)
i still didn't solved the problem with height but finally i found the cause of this.
below is ready to use code that demonsrates what happens in IE when DOCTYPE declaration is changed...
the first DOCTYPE in his code is what i use and why all above suggestions for fix don't work.(this DOCTYPE taken from
http://www.w3.org/QA/2002/04/valid-dtd-list.html)
The second DOCTYPE is something my editor generates automaticly and it is commented out in below code...
Now try the following:
ran the code below first time with first DOCTYPE and second time with second DOCTYPE and see how height:100% is affected...
So if i want height:100% to work i need to use second DOCTYPE
Can i make it to work with first DOCTYPE ?
Code: Select all
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!--<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">-->
<html>
<head>
<title>test</title>
<style>
#divr{height:100%;background-color:#0f0;}
#divl{height:100%;background-color:#00f;}
</style>
</head>
<body>
<table width="100%" border="0" cellpadding="0" cellspacing="0"><tr>
<td width="50%">
<div id="divl">line 1<br />line 2<br />line 3<br /></div>
</td>
<td height="100%">
<div id="divr">line 1<br /></div>
</td>
</tr></table>
</body>
</html>what i found out afer submitting of this post is that if i use:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
then IE works in non-standarts mode and i don't want that
(it is equavalent to not specifying DOCTYPE at all)
taken from http://www.sitepoint.comquirks mode in IE is triggered by not having a doctype or using a partial html doctype without uri.