As you make adjustments through your Style Designer—whether it’s with your widget margins or padding—you are given the option to use px or rem. We recommend using REM values when possible.
Px is an absolute measurement, which means whatever your screen size, the size of the particular element will not change. REM is known as a relative measurement, which means the size of the element will scale down or up to match the screen size used.
As more and more visitors are viewing your site from their mobile devices, your website content needs to be responsive and adapt to smaller screen sizes. REM helps it be responsive.
To ensure your site looks good on all screen sizes, you need to select the rem values for the various elements in your Style Designer.
Tip! You may need to use trial and error when adjusting your style from PX to REM. A good rule of thumb is that PX will be about 10 times more than REM. For example, 20px equals 2rem or 200px will be around 20rem. You can also visit this nifty site to see the conversion of px to rem.