We'll get started by creating a basic HTML document and associated files and folders just like we did in Chapter 1, Designer, Meet jQuery. Inside the HTML document, we're going to place a headline as follows:

<header>
  <h1>Pride &amp; Prejudice</h1>
</header>

Next, we'll add some styles to style our headline the way we'd like. Open your styles.css file and add the following lines:

header {
  margin: 5.063em 0;
}

header h1 {
  line-height: 1.125;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
}

h1 {
  font-size: 3.375em;
}

We've removed any default margins or padding from the <h1> element. We'll use the <header> element to add white space around our headline instead. Also, note that we used a unitless number for our line-height value. Unitless line heights allow these values to...