CSS and Javascript - height issue

I am having trouble getting an image in my design to stretch correctly
with the main content. Here is a link

http://creativeness.com/temptest/test9.html

Now the image on the left below the navigation (the one that is 65
pixels tall) I want to strech from the bottom of the one image to the
top of the bottom menu. Like on this page

http://creativeness.com/temptest/test10.html

On that page I am trying to use this javascript code

<script language="javascript" type="text/javascript">
var myVar = document.getElementById("siteContent").offsetHeigh t;
var nheight = myVar/10-200+'em';
alert('The height is '+myVar+' the new height is '+nheight );
</script>
<style>
#leftSide5height {
height:nheight;
}
</style>

But it seems that
height:nheight;
isnt the correct way to pass the variable that i determine because it
works if I put a number in there like this


#leftSide5height {
height:50em;
}

Any ideas how to get the correct number and pass the variable? Thanks
for your help.

re: CSS and Javascript - height issue

Rabel wrote:Of course not. The JavaScript var "nheight" is not automatically
expanded with HTML! You would have to have a script run on the
document's onload event, probably with a delay setTimeout to get the
value of "siteContent" after the page loads. Then apply the value to
"leftSide5height".

Seems like a bad idea all around.

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

re: CSS and Javascript - height issue

On Aug 4, 6:46 pm, "Jonathan N. Little" <lws4...@central.netwrote:Thanks Jonathan,
The script is run after the main content and before the leftSide5 is
called and like I said it works fine if you change that code to

#leftSide5height {
height:50em;
}

so Im not sure if i need to move it or not, but either way I still
dont know how to pass the nheight variable to the height attribute.
Any ideas?

re: CSS and Javascript - height issue

Rabel wrote:Why do you need to stretch it at all? Why not just use that 65px tall
graphic as a repeating background image down the left side of the
container? You can still get the white spaces between elements over
there by using background and/or border properties.

--
Berg

re: CSS and Javascript - height issue

Rabel schrieb:THIS is not "Script" - this is inline CSS. It has nothing to do with the
<scriptelement preceding it. You can use JS to set style attributes
but you can't access JS variables or other code from CSS.
If you use JS to determine the height, why not use JS to *set* it as well?

And please bear in mind that all of that won't work if the user has
turned JS off.

re: CSS and Javascript - height issue

On Aug 4, 8:40 pm, Bergamot <berga...@visi.comwrote:Thanks Berg,
Using a repeating background would be fine but I dont know how to tell
it the height of the element.

Christian,
"If you use JS to determine the height, why not use JS to *set* it as
well? "

I just dont know how to "set" this height I thought this would work

height:nheight;

Do you know how I would set the height?

Thanks Guys I really appreciate the help.

re: CSS and Javascript - height issue

Rabel schrieb:
I suggest that you read some elementary text on DOM scripting. What's
the point to use JS if you don't know what your can do with it?

document.getElementById('id').style.height= nheight+'px';

is *one* possibility to achieve what you want. It still only works when
the user has JS turned on.

And maybe you should be a bit more specific in your responses - replying
to two different posts in the same text is not very sensible.

re: CSS and Javascript - height issue

Rabel wrote:You shouldn't need to set any explicit height. The container should size
itself according to the content, unless you've done something silly like
absolutely position everything.

--
Berg