Using a variable for div height?

Question

In the script part of the page, I have a function that figures out the screen height and assigns it to a variable - myHeight (it's really screen height * .90).

In the body of the page, I have a div with some properties, one being height. height:90% isn't working in IE8, so that's why I'm using that function to calculate screen height in pixels and then I want to plug that variable in to the height property of the div.

I also created a strHeight which is myHeight+"px". When I alertbox it, it shows up looking right. Like "810px".

So, when I set the div property as height:'strHeight', the page breaks.

Here's the page. Has a ton of javascript in it - http://gisnet2.cstx.gov/gisweb/base/base.htm

And here's the div line. -

Major thanks for any help you can provide!

Answer 1

if you specify a height to the body {height: 100%;} which is the parent of div, then the div will be able to calculate fractions. without a parent reference, the div does not know what is 90%.

sweet page, by the way.

Answer 2

I'm not familiar with Dojo so could be wrong about this if Dojo does something interesting here, but would guess that:

<div id="map" style="position:relative; height:'strHeight'; width:99%; border:1px solid #000;"></div>

Is the problem, JS variables are not automatically interpolated into HTML content.

You could try:

dojo.style("map", "height", strHeight);