HTML & CSS Essentials For Dummies

Chapter 7

Taking the Measure of CSS

IN THIS CHAPTER

A brief overview of measuring CSS things

Understanding the CSS absolute measurements

Becoming acquainted with CSS relative measurements

In this chapter, you replace your artist’s beret with your engineer’s hard hat and dive into the world of CSS measurement units. Happily, although CSS seems to support an endless number of units, you learn in this chapter that for your everyday CSS needs, there are just a few units that you need to be familiar with.

Getting to Know the CSS Measurement Units

Many CSS properties require a value that’s a measure of some kind. For example, a border takes a length value that determines the width of that border. Similarly, a block element can take a dimensional value that sets the block’s width or height. Values such as length or dimension are called measurement values, and they’re essential not only to box model components such as padding, borders, margins, width, and height, but also for many other CSS features, including font sizes, shadow widths, and line spacing.

Almost every measurement value requires a measurement unit, which is a short code that specifies which unit you want the browser to ...