Ben Ben - 1 year ago 84
Javascript Question

How to increase Googles polyfill dialog height dynamically

I use Googles polyfill dialog and want to increase it's height dynamically depending if a user clicks a dialog button to add more elements (rows) in it.
This is part the javascript which is called when the user cklicks that button :

var mc_dialog = document.getElementById('mc_dialog');
var h =;
console.log("mc_dialog height = ",h);

is simple empty, no value - nothing

While = "500px"
works perfect.

Why do I not get the value of


Ok after the answer of Evil Penguin I set the height
in the javascript function, which opens the dialog, like this : = "500px"

and later when the user clicks to add content to the dialog I can retrieve the height now, so it look like this now :

var mc_dialog = document.getElementById('mc_dialog');
var h = parseInt(; h+50+"px";

and it works perfect.

But now I have the question why do I have to set the style.height initially ? Isn't it a permanent attribute of that element ? And if not, why ?

Answer Source

Here is similar question.

.style.height only works if you have set the property in the first place.


Here is reference of property. It says:

The style property is not useful for learning about the element's style in general, since it represents only the CSS declarations set in the element's inline style attribute.

So as i understand it, if there is no style="smth" in the element's inline declaration, doesn't work.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download