From the course: Creating a Responsive Web Design

Unlock this course with a free trial

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

Making adjustments for medium screens

Making adjustments for medium screens - CSS Tutorial

From the course: Creating a Responsive Web Design

Making adjustments for medium screens

- The next break point that we're going to need for this particular design is going to be at about 760 pixels. Let's go back to our CSS file. Let's come up here and copy the media query for 825. Let's come down here and pace this after. Let's change the max width to 760px. First, we'll make some changes to all of our heading tags. First, we'll target the h1 tag. We're going to set font size to 1.8em. Then, we'll duplicate this two more times. We'll change the h1 to an h2 on the second line. We'll make that 1.4em. On the third one, we'll change this to h3, and we'll set these to 1.1em. On the next line, let's target the anchor tag with a class of btn and we're going to set the font size here to 1em. Next, we'll make a few adjustments to the header. I'll copy this comment, add a few lines, paste it. Then, we're going to target the logo inside of the header. So, header a.logo and put in our brackets. We're going to change the width of this. So, we're going to set a width of 145px. Then…

Contents