Forum Moderators: not2easy
This code:
<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<script type="text/javascript">
<!--
function howTall() {
if (typeof document.height!= 'undefined') {
docHeight = document.height;
} else if (document.compatMode && document.compatMode!= 'BackCompat') {
docHeight = document.documentElement.scrollHeight;
} else if (document.body && typeof document.body.scrollHeight!= 'undefined') {
docHeight = document.body.scrollHeight;
}
alert (docHeight);
}
//-->
</script>
</head>
<body onload="howTall();">
<p>Hello World</p>
<div style="float: left;"><img src="somepic.jpg" width="600" height="400" border="0" /></div>
</body>
</html>
gives the correct height in IE7, but reports only the height of the <p> in Firefox.
Has anyone seen this before? Does anyone have a workaround so that I can find the actual height of the document in Firefox?
One option might be to add a wrapper:
<body>
<div id="wrapper">
<p>Hello World</p>
<div style="float: left;background-color: red;"><img src="somepic.jpg" width="600" height="400" border="0" /></div>
</div>
</body>
Then give it a style rule for 'overflow':
#wrapper { overflow: auto; }
And then get the #wrapper's scrollheight.
Hope that helps.