From the course: Responsive Typography Techniques

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Using media queries to set natural typographic breakpoints

Using media queries to set natural typographic breakpoints - CSS Tutorial

From the course: Responsive Typography Techniques

Start my 1-month free trial

Using media queries to set natural typographic breakpoints

“

In this tutorial, we're going to take a look at our example page and add some media queries, specifically to address our typography. If you're not familiar with media queries, or you haven't used them in a while, you may want to check out the Responsive Design Fundamental Course by James Williamson, especially the Understanding media queries section. To recap just a little, the widths we saw some issues at were ones like the very narrow ones at around 320, where we noticed our headlines broke in a really strange way, and our line lengths were definitely far too short. As we got bigger, we noticed that in around 900 pixels and above, that our line length and our body text got just a bit too long. So, we wanted to address that, as well. And, of course last but not least, we noticed that once we got past, you know, 1200 pixels or so, things got really out of hand and we didn't want our line stretching that long. So, we'll use the notes to create some type specific media queries or type…

Contents