Our site looks pretty great right now, but there’s one more thing we can do to make it even better. Let’s make our
main tag sit next to each other. Using CSS, there’s a couple ways we can do this. The approach we’re going to take is using floats.
In your profile.html file, let’s add a div tag that wraps around both the aside tag and the main tag.
If you’re confused as to where to put this tag, don’t be afraid to ask a mentor to help you make sure your opening and closing div tag is in the right place.
Let’s open styles.css
main CSS block, we’re going to add a
width property and a
Add to your CSS until the main is styled like:
Amazing. The last piece of our layout puzzle is to add a
Note: If you chose some custom colors, be sure you don’t overwrite them.
Okay, let’s save profile.html and styles.css, and refresh the page.
Woo! You’ve done it. Look at those beautiful floating HTML elements.