Menu
I use this code in JS:
bigPhoto.setAttribute("width", "200rem");
The result is in pixel in html source,
But:
When I change it to 20rem the photo become really small.
I couldn't solve the problem which is mentioned in the photos.
997
To recap, the rem unit means "The root element's font-size" (rem stands for "root em"). The <li> elements inside the <ul> with a class of rems take their sizing from the root element ( <html> ).
rem is depend on device and it is suggested to use if the website is for any different devices with different density. for the project that I should write, I am supposed to use DOM so I used JS to set the width but rem in js doesn't work . We couldn't tell that 20rem = 200px in all devices.
1 rem = 16 pixels. So all you have to do is divide the units of your design in pixels by 16. For example, a font that was 32 pixels in size becomes: 2 rem. 32 (px) /1 6 = 2 (rem)
Another method would be to convert rem into pixels:
function convertRemToPixels(rem) {
return rem * parseFloat(getComputedStyle(document.documentElement).fontSize);
}
This can be useful when you must perform some arithmetic in js (such as using the position of the mouse to display a tooltip...)
168
The HTML width attribute only takes an integer number of pixels or a percentage (followed by a % sign).
If you wish to use CSS length units you have to use CSS (and set bigPhoto.style.width = "200rem".
22
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
