Based on the instructions below, add CSS to your style sheet to alter the way the page looks. The image I$$ve provided is an example of how the assignment should look after you are done with it$.$ Your page should look pretty close to mine if you follow the steps outlined below. You can use different colors$/$fonts if you want, but the general properties should still be used.

Instructions for Adding CSS

These instructions are for those of you who choose to use floats for your page. If you want to use flexbox, you can set the display of the parent containers to flex, and then alter the widths$/$margins of the flex items $($child elements$)$ from there. You could realistically leave the $.$row styles and add display: flex to the $.$row CSS declaration for this part.

You can also use other methods as you see fit, but I wouldn$$t recommend trying to use the position property as it is cumbersome and difficult to do$.$ Please note that this list isn$$t exhaustive, it will help get you started. You may edit the HTML to better fit your positioning method. The only caveat is that the content should remain the same on the page as far as text, images, links, etc.

General$/$Body Styles

Add a font$-$size of $16$px to the body and set the margin to $0$

Give the container a max$-$width of $900$px$,$ a width of $100\%,$ and center it with margin: $0$ auto

Most containers have a padding of $10$px

Border$-$radius has been set to $10$px for any rounded corners

Border$-$radius has been set to $50\%$ for circular images

Link tag colors have been altered

Images have a max$-$width of $100\%$

Header Styles

I gave the header a height of $4\mathrm{.}5$em$,$ a black background, a white color, and padding of $0$ on top$/$bottom and $10$px on the left$/$right sides

The h$2$ is floated to the left with some margins on it

The nav has a margin on top of it $(1\mathrm{.}8$em$)$ and is also floated to the left

Aside Styles

Aside has been floated to the left and has a width of $30\%$ and a margin on the right side of $5\%$

Both images are centered, the first one has a $2$px solid black border, the second one is circular

Main Styles

The main class is also floated to the left with a width of $65\%$

The images in the section tags are floated with a margin around them

The paragraphs In the section tags have no margin on top

The blog posts have a width of $45\%$ and margins of $2\mathrm{.}5\%$ on all sides

The images$/$containers in the blue blog posts have a top$-$left and top$-$right border radius applied

The blog post h$4$ tags have margin applied: $\mathrm{.}5$em $\mathrm{.}5$em $1$em

The blog post p tags have padding applied: $0\mathrm{.}5$em

Footer Styles

The footer has a back background with white centered text

If your CSS isn$$t working at all, it$$s probably because the href value you$$ve provided in the link tag is incorrect. If your CSS is working, but some styles are not appearing as you expect, check for missing semicolons and make sure you aren$$t overriding your style in some other declaration that is more specific.