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.

Styling the logo and hero item

Styling the logo and hero item - CSS Tutorial

From the course: Creating a Responsive Web Design

Styling the logo and hero item

- Now we're going to bring our logo, the logo SVG into our layout by assigning it to be the background of the anchor tag we added earlier inside of the heading area. And this is the main link for the site. So we're going to start by typing header, then a space, what this allows us to do is target only items inside of the header. We're going to target a.logo. So this will target the anchor tag with a class of logo. If we go back to the HTML file, we'll see that this is right here, here's the anchor tag and here's logo, inside of the header element. Now the first thing we're gonna do is we're gonna set position of this to absolute. This way when we assign positioning poroperties it will position in relation to this header element because of the position relative on the parent. So after position absolute, we're gonna set a display type to block, by default anchor tags have what's called an inline style, which means they don't have any dimensions, they will basically stretch to their…

Contents