How to set the minimum height of an element with JavaScript?

JavascriptWeb DevelopmentFront End Scripts

Use the minHeight property in JavaScript to set the maximum height. You can try to run the following code to set the minimum height of an element with JavaScript −

Example

Live Demo

<!DOCTYPE html>
<html>
   <head>
      <style>
         #box {
            width: 300px;
            background-color: gray;
            overflow: auto;
         }
      </style>
   </head>
   <body>
      <p>Click below to set Minimum height.</p>
      <button type="button" onclick="display()">Min Height</button>
      <div id="box">
         <p>This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div.</p>
         <p>This is a div. This is a div. This is a div.</p>
      </div>
      <br>
      <script>
         function display() {
            document.getElementById("box").style.minHeight = "400px";
         }
      </script>
   </body>
</html>
raja
Published on 27-Feb-2018 18:18:05
Advertisements