Hello i am dealing with the issue of changing unit into rem
dynamically in css
- i’ll set root font-size as 23px
- my present font-size is 16px
- my anticipated outcome must be
16 / 23 => 0.695rem
Query: i wish to do that calculation in css 16 / 23 => 0.695rem
which isn’t working
right here is how i attempted css:
#im_p{
font-size: calc(var(--im-p-font / 16)) rem;
}
here’s what i’ve tried:
const root = doc.documentElement;
root.fashion.setProperty('--im-p-font',23);
#im_p{
font-size: calc(var(--im-p-font / 16)) rem;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Suitable" content material="IE=edge">
<meta identify="viewport" content material="width=device-width, initial-scale=1.0">
<title>Doc</title>
</head>
<physique>
<p id="im_p">I am Paragraph<p>
</physique>
</html>
Notice: above code css is just not working