From the course: Creating a Responsive Web Experience
Join today to access over 22,600 courses taught by industry experts.
Positioning the image and caption
From the course: Creating a Responsive Web Experience
Positioning the image and caption
Now that we have the HTML dynamically loading into our index.html file inside the heading area, we need to style this content at the top. So, let's come back to our screen layout large.css file in our text editor. Let's come down and find the header element and then the anchor tag with the class of logo. Let's come in here and let's find the right position property. Let's change that to left so we're going to have top 28 left 30 pixels. Let's scroll down. After the media query where we're redefining the padding and the footer. Let's hit a few returns and now we're going to add in some rules that are going to target the hero id and start styling the hero HTML that was loaded in from the external HTML file. So the first rule, we're going to target the hero container. So just pound hero. We're going to set a property of height to 275 pixels. We're going to set position to relative. And then we're going to set the overflow to hidden. Next rule, we're going to target the panels inside of…
Practice while you learn with exercise files
Download the files the instructor uses to teach the course. Follow along and learn by watching, listening and practicing.
Download courses and learn on the go
Watch courses on your mobile device without an internet connection. Download courses using your iOS or Android LinkedIn Learning app.