Question 245530 in Html Question posted in
Some basic documentation can be found here.

Html – Can not change div height dynamically

I have a DIV:
<div class="div_tab" id="div3"> </div>

Its properties are defined:

.div_tab {
    top:0;
    position: sticky; /* make the table heads sticky */
    display: inline-block;
    height : 500px;
    width :auto;
    overflow-x: hidden; 
    overflow-y: auto;
    border : 1px black solid;
    padding:0;
    margin-left: 10px;
    margin-right:10px;
    margin-bottom:5px;
}

It really have assigned height.
But when I change height:

this.tabDiv.setAttribute("height",px); // px is calculated
this.tabDiv.setAttribute("max-height", px);

Height does not change.
When I ask attribute value:
alert(this.tabDiv.getAttribute("height"));

I see value of "px".
How can I change div’s height?

Tags:

2

Answers


  1. 0

    setAttribute() is typically used to set HTML attributes, not CSS properties:

    You can try using style property to set the CSS property like the following way:

    var heightPx = "200px";
var tabDiv = document.getElementById("div3");
tabDiv.style.height = heightPx;
tabDiv.style.maxHeight = heightPx;
    Login or Signup to reply.
  2. 0 
    document.getElementById('div3').style.height = px;

    try this way.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search