+ 3

How to change div's height and width with Javascript?

Hello everyone, I need to change div's width and height only using Javascript. In html I've one div and three input fields, which sets div's height width and color. Last one is working, but I can't change height and width which are set in input fields. Please help.

html javascript html5 width height

12th Jan 2017, 10:51 PM

Dima Simonishvili

3 Answers

+ 4

<!DOCTYPE html><html> <head></head><body> <style> #demo { border: 1px solid black; } </style> <div id="demo"> <form> <input type="text"><br> <input type="text"><br> <input type="submit"> </form> </div> <script> document.getElementById("demo").style.width = "300px"; // width document.getElementById("demo").style.height = "100px"; // height </script> </body></html> Hope I helped! :)

12th Jan 2017, 11:24 PM

Йордан Петров

+ 2

@Louis thanks for this tip. I'll use it in future. But for now I needed only pure Javascript. @Йордан Thanks for this great example, it helped me very much!

13th Jan 2017, 6:04 PM

Dima Simonishvili

Just as a tip of the hat to jQuery and why it should be learned... $('#demo').css({'width':'100%','height':'auto'});

13th Jan 2017, 12:56 AM

Louis Milotte