By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,788 Members | 1,115 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,788 IT Pros & Developers. It's quick & easy.

Finding div height when defined in a stylesheet

P: n/a
I'm trying to detemine the height of a div in javascript. The actual
height is defined in the attached stylesheet. When I query
document.getElementById("ModuleHeader").style.heig ht I get undefined.
Here's a bit of the code:
<div id="ModuleHeader"> <img src="photobugHEAD.jpg" width="572"
height="153"></div>

The attached stylesheet contains this defintion:

#ModuleHeader {
width: 100%;
height: 153px;
position: relative;
top: 0px;
left: 0px;
z-index: 20;
text-align: left;
background-color: #33CCCC;
}

But this javascript returns undefined:
document.getElementById('ModuleHeader').style.heig ht;

How can I get that to return 153? I don't want to rely on the height
of the image, which in this case happens to be the same height as the
div.

Thanks,
Nate Baxley
Jul 20 '05 #1
Share this Question
Share on Google+
2 Replies


P: n/a
nbaxley wrote:
I'm trying to detemine the height of a div in javascript. The actual
height is defined in the attached stylesheet. When I query
document.getElementById("ModuleHeader").style.heig ht I get undefined.
Here's a bit of the code:
<div id="ModuleHeader"> <img src="photobugHEAD.jpg" width="572"
height="153"></div>

The attached stylesheet contains this defintion:

#ModuleHeader {
width: 100%;
height: 153px;
position: relative;
top: 0px;
left: 0px;
z-index: 20;
text-align: left;
background-color: #33CCCC;
}

But this javascript returns undefined:
document.getElementById('ModuleHeader').style.heig ht;


Just to let you know, it works in Moz and IE if you put the
style="height: 153px" directly into the <div>. I understand that might
not be what you want as it's bad style. Could you explain why you want
to read out the height in the first place? Maybe that would help in
figuring out a solution to the problem.
Jul 20 '05 #2

P: n/a
nbaxley wrote:
<div id="ModuleHeader"> <img src="photobugHEAD.jpg" width="572"
height="153"></div>

The attached stylesheet contains this defintion:

#ModuleHeader {
width: 100%;
height: 153px; [...] }

But this javascript returns undefined:
document.getElementById('ModuleHeader').style.heig ht;


The style property refers to inline styles (i.e. contents of a style
attribute). You may try to traverse the CSS DOM.

--
Johannes Koch
In te domine speravi; non confundar in aeternum.
(Te Deum, 4th cent.)

Jul 20 '05 #3

This discussion thread is closed

Replies have been disabled for this discussion.