Problems converting px to Percentage

Asked

Viewed 401 times

2

I have this code : 

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
  </head>
  <body>
    <div style="width:50%;height:30%;background:#65C6BB;position:absolute;transform: translate(20px,0px);">
    </div>
    
  </body>
</html>

I wanted to convert the 'Transform' CSS property to percentage as well.

I’m using the rule : (100 / window.innerWidth) *pixels

Only that doing this my result for a 1920 Window Width is : 1.041666666666666667 ...

If I replace this in the 'Transform' CSS property like this :

transform: translate(1.0416666666666667%,0px);

Div will not be in the same position. I have tried using window.document.body.offsetWidth but it also doesn’t work.

Does anyone know what the solution is?

javascript css3 percentage

1 answer

1

Browser other questions tagged javascript css3 percentage

You are not signed in. Login or sign up in order to post.