From the course: Design the Web: Styling a Numbered List

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Add style and formatting for the new HTML markup

Add style and formatting for the new HTML markup - CSS Tutorial

From the course: Design the Web: Styling a Numbered List

Add style and formatting for the new HTML markup

- So now to complete the layout for our numbered list, we're gonna target the emphasis tags and strong tags that we put in previously. So up in our CSS area, let's find our pseudo element. Let's add a rule after the pseudo element. And let's first target the emphasis tags. So we'll type ol.cities space li space em. Want to come in here and split that open. First thing we want to do is set the display type of this element to a block. Once we do that, you'll notice that all of the country names will now be on their own line. That emphasis tag is now behaving like a paragraph or a div element, taking up an entire line in the html because of the block properties. Back in the CSS, let's add another line. We want to use the font family Roboto. So let's come up here and select that from the pseudo element. Let's paste that down here. Let's add a return, next line. We're gonna set letter spacing. We're gonna set this to .3 ems just to space that out a little bit. Next line we're gonna set…

Contents