<html> <body> <div id="wrapper"> <div id="header"> <h1>Lorem Ipsum</h1> </div> <div id="article"> <h2>Lorem Ipsum</h2> <p>Lorem Ipsum is simply dummy text and typesetting industry.</p> </div> </div> </body> </html> html, body { font-size: 12px; } h1 { font-size: 22px; } h2 { font-size: 18px; } p { padding: 10px 5px; } #wrapper { width: 1000px; } #article { width: 600px; margin: 30px 30px; padding: 10px 5px; }

Good day everyone! There was a question about converting from PX to EM . Seen a lot of good sites use EM .

How to convert - an example (see above)?

Tell us how you use?

I would be grateful for any information!

* Before the code I connect resetting all styles.



    3 answers 3

    The pxtoem.com website specializes in this topic.

    • in boorbon sass mixins there is an em function (10px) - translates 10px into em, recently noticed that it is considered deprecated, who can say why? - junior-web-dev

    1 em = 16px

    font-size: 12px; = font-size: 0.75em;

    etc. :)

    • 1 em is not 16px, but font size! - Pavel Mayorov

    I use this site https://all-markup-news.com/px-to-em/ for conversion

    • Although the link can find the answer to the question, it is better to point out the most important thing here, and give the link as a source. If the page to which the link leads will be changed, the response link may become invalid. - From the queue of checks - Denis
    • @Denis more attentively, please. It is likely that the link author was the one who needed the question. - Pavel Mayorov