Detecting the height of a div/span

[Timg]

I've searched the archives and did not find anything about this.

This is not really a troubleshooting issue. It's probably more a design issue.

I working on using a div or span (haven't decided which will suit my needs yet) to display a tooltip for another div containing messages.

The tooltip will display above the message div and cannot exceed 305px in height. However the tooltip will contian dynamically generated text which can be of 1 to n text lines and should only reflect a size comparable to the amount of text that it contains(scrolling when the content size exceeds 305px). The style for the message div/span is as follows

#tooltip {
font-family: Arial, Helvetica, sans-serif, Verdana;
font-size: 10pt;
height:auto;
width:764px;
visibility:hidden;
overflow:auto;
}

I pull the messages from a message array using the join method.

<div id="tooltip"/>

snippet code
var messages = msgArray.join("<br/>");
var container = document.getElementById("tooltip")
container.innerHTML = messages;

This code is functional.
Is there a way to then determine what height the content (messages) of the container is?

I've tried...

container.scrollHeight
container.clientHeight

These properties return 0.

container.style.height

This returns 'auto' of course...

So the issue is if I use a div/span to encapsule my tooltip, how can I determine the height of the content so that I can dynamically positoin the tooltip?

Is there a better/easier way?

One thought I had was to loop through the msgArray and determine the number of lines based upon the message count. I don't really like that approach since that code will need to be updated if really long messages are added in the future.

Any thoughts? Suggestions?

Tim
Computer Research Inc.

[Khalid Ali]

document.getElementById("divId").offsetHeight

[Timg]

The one i didn't try. Got it now though.

Cheers,
Tim

[Khalid Ali]

You are welcome....:D