"Assessment wanted: for Typesetting a community school homepage"

Here is the link to my assessment. Please tell me if I passed all the conditions or if there is a better way to write the code. Thanks.

Hi @Arthur_Chen, and thanks for sending in your code!

This looks really good, nice work!

The only things I’d change are as follows:

  1. Put the sizing of the nav menu buttons on the <a> elements, not the <li> elements. As it currently is, you’re making the buttons the size they are by putting padding on the <li>. This makes the buttons look big enough, but the trouble is that the <a> elements are tiny and in the center of the button, and the hit area for the button is therefore tiny and in the center (try hovering over them and you’ll see what I mean).

If you instead size the <a> element, the hit area will be the entire button, which is more what you want. Get rid of the padding on the <li> elements, and try this, for example:

a:link {
    color: #ba7967;
}

nav a:link {
    padding: 2rem 3rem;
    display: block;
}

(you’ll need to put this sizing on just <a> elements inside the <nav>, otherwise it’ll put this sizing on all links!)

  1. On the exteral links, I’d just increase the right padding slightly to put a small gap between the link and the icon. They are currently squashed up together. Maybe 2.3rem instead of 2rem?