How can I increase the width of an element by 10rem using jquery. Issue is Jquery always return width/height in pixels and we want to update the height/width in some other units.
Example on: JS Bin
var $c = $('#container');
console.log($c.width());
var c = document.getElementById('container');
// Q1. Why is it different from above one. This is 324 while earlier it was 320. See the output.
console.log(c.clientWidth);
// Q2. How to update the code to increase the width by 10rem.
$c.css({width: $c.width() + 10}); //It adds 10 pixels here.
console.log($c.width());
My questions are comments in the code.
rem
unit is for Fonts only according to W3C standars see: w3.org/TR/css3-values