Fixit – Measures

Avoiding pixel and absolute measures allows the browser to adapt content to fit the display, though there are exceptions to this rule (see below). This test checks for the use of absolulte and pixel measures where relative measures would be more appropriate

Using relative measures

You should try to use relative measures where possible. You can achieve this using measures such as em, ex, bolder, larger and thick.

e.g. Specify font size:

Correct: font-size: 1.5em;

Incorrect: font-size: 12px;

Exceptions

It is not always desirable to use relative measures. For instance, images may be tailored to fit particular displays. In this case it makes more sense to specify the dimension in pixels.

Note:
The intrinsic size of images must be specified as attributes of the img element and not as CSS properties!

There are also other situations where pixel measures might be more appropriate: margins, borders and padding are all examples of when you might want to use pixel measures instead.

Passing the test

This test checks your CSS properties as follows:

Any property which is not a padding, border or margin property, and which is not specified as a percentage, or using units em or ex will cause the test to fail.

You should therefore only use pixel measures where the property is not one of those mentioned above.

Reference

This test is based on a W3C mobileOK best practice. See http://www.w3.org/TR/mobile-bp/#MEASURES for more details.