html - How to get display width of inline-block fieldset from javascript -


if have fieldset display: inline-block, has width dependent on contained element. can see it, assuming:

<fieldset id='fs' style='display: inline-block'>   <input type=number> </fieldset>  <script>   var fs=document.getelementbyid("fs");   console.log("fs.width:",fs.width); </script> 

the output be:

fs.width: undefined 

after trying lot of things able this:

<script>   var fs=document.getelementbyid("fs");   var fsrects=fs.getclientrects();   var fswidth=fsrects[0].right-fsrects[0].left;   console.log("fswidth:",fswidth); </script> 

and output is

fswidth: 98.6640625 

there must easier way! help!!!

you looking offsetwidth.

the htmlelement.offsetwidth read-only property returns layout width of element. typically, element's offsetwidth measurement includes element borders, element horizontal padding, element vertical scrollbar (if present, if rendered) , element css width.

  var fs=document.getelementbyid("fs");    console.log("fs.width:",fs.offsetwidth);
<fieldset id='fs' style='display: inline-block'>    <input type=number>  </fieldset>


Comments

Popular posts from this blog

Is there a better way to structure post methods in Class Based Views -

reflection - How to access the object-members of an object declaration in kotlin -

php - Doctrine Query Builder Error on Join: [Syntax Error] line 0, col 87: Error: Expected Literal, got 'JOIN' -