How to set width of a div in percent in JavaScript

Question

Is it possible to set the height width of an element in percent using JavaScript or jQuery

User · Answer

jQuery way -       id   width  30

User · Answer

Yes  it is    lt div id  myid  gt Some Content         lt  div gt   document getElementById   myid   style width    50

User · Answer

Also you can use  prop   and it should be better because     Since jQuery 1 6  these properties can no longer be set with the  attr   method  They do not have corresponding attributes and are only properties      elem  prop  width    100       elem  prop  height    100

User · Answer

The question is what do you want the div s height width to be a percent of   By default  if you assign a percentage value to a height width it will be relative to it s direct parent dimensions  If the parent doesn t have a defined height  then it won t work   So simply  remember to set the height of the parent  then a percentage height will work via the css attribute   obj style width    50

User · Answer

testjs2                                    document  ready function                form1   validate            rules               name   required     simple rule  converted to  required true             email      compound rule            required  true             email  true                      url               url  true                      comment               required  true                                 messages               comment   Please enter a comment                                        function             var ok confirm  Click  OK  to go to yahoo   CANCEL  to go to hotmail       if  ok      location  http   www yahoo com      else     location  http   www hotmail com             function changeWidth        var e1   document getElementById  e1        e1 style width   400         lt  script gt       lt style type  text css  gt           font-family  Verdana  font-size  11px  line-height  14px          submit   margin-left  125px  margin-top  10px         label   display  block  float  left  width  120px  text-align  right  margin-right  5px          form-row   padding  5px 0  clear  both  width  700px          label error   width  250px  display  block  float  left  color  red  padding-left  10px          input type text   textarea   width  250px  float  left          textarea   height  50px        lt  style gt       lt  head gt      lt body gt         lt form id  form1  method  post  action    gt          lt div class  form-row  gt  lt span class  label  gt Name   lt  span gt  lt input type  text  name  name    gt  lt  div gt          lt div class  form-row  gt  lt span class  label  gt E-Mail   lt  span gt  lt input type  text  name  email    gt  lt  div gt          lt div class  form-row  gt  lt span class  label  gt URL  lt  span gt  lt input type  text  name  url    gt  lt  div gt          lt div class  form-row  gt  lt span class  label  gt Your comment   lt  span gt  lt textarea name  comment   gt  lt  textarea gt  lt  div gt          lt div class  form-row  gt  lt input class  submit  type  submit  value  Submit  gt  lt  div gt          lt input type  button  value  change width  onclick  changeWidth     gt         lt div id  e1  style  width 20px height 20px  background-color  096  gt  lt  div gt       lt  form gt         lt  body gt    lt  html gt

User · Answer

document getElementById  header   style width    50      If you are using Firebug or the Chrome Safari Developer tools  execute the above in the console  and you ll see the Stack Overflow header shrink by 50

User · Answer

I always do it like this       id   css  width    50

[javascript] How to set width of a div in percent in JavaScript?

Examples related to javascript

Examples related to jquery