Menu
Is it bad in terms of compatibility to use pixel numbers in CSS instead of percentages? How about lower resolutions? Is it okay to work with them in ranges of 1-100?
224
px is not scalable, it is an absolute unit. Change in the value of another element does not affect the value of absolute units. The value assigned is fixed irrespective of the user setting.
% is also a relative unit, in this case, relative to either the height or width of a parent element. They are a good alternative to px units for things like the total width of a design if your design does not rely on specific pixel sizes to set its size.
Clearly, there is nothing right or wrong. With pixels, it is easy to position objects relative to each other and controls specific heights and widths. On the other hand, scaling objects with percentages is easy. % Is the way to go in a modern world like vector graphics.
So to answer our original question, “what changes in our design when using rem instead of px ”. The answer is, for all users not changing root font-size (which, no doubt, is the large majority), absolutely nothing changes and your design looks just as it would with px .
All of the measurements have their own purposes:
Use pixels for pixel-based things, like borders. You probably don't want a border that ends up being 1.3422 pixels wide.
Use text-centric measures (em, ex) for text-based things, like content areas, labels, and input boxes. It's an easy way to make sure you have room for text of a certain length and width.
Use percents for window-based things, like columns.
There are exceptions, of course. For example, you might want to specify a minimum column width in pixels. But follow the above and your pages will scale well. ALWAYS zoom in and out on your pages to see how they work with different font sizes and browser shapes -- don't get surprised later.
175
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
