Extending div's height beyond its max height from javascript

I have a div in an user control, whose max height is set to 400px in css. This user control is used in many of aspx pages in my application.

I am trying to increase the div height to 500px dynamically in JavaScript for only one page, but it doesn't work. The div in user control always takes only th开发者_高级运维e 400px (max height set in css) and not the height set by JavaScript.

Is there a way to change the div height over max height from JavaScript?

Thanks

You'll need to set the max-height property before you can set the height to be greater than it.

So, rather than this:

function setHeight()
{
    var e = document.getElementById("myDiv");
    e.style.height = "500px";
}

You'll do this:

function setHeight()
{
    var e = document.getElementById("myDiv");
    e.style.maxHeight = "500px";
    e.style.height = "500px";
}