HTML and CSS Reference
In-Depth Information
9. }
10. a:hover {
11. color: #a9b2b9;
12. }
6. Now let's take a look at our <header> element and update our styles there. We'll
begin updating our logo by adding the font-size and line-height proper-
ties within the logo rule set. Adding to the existing border-top , float , and
padding properties, the new rule set should look like this:
Click here to view code image
1. .logo {
2. border-top: 4px solid #648880;
3. float: left;
4. font-size: 48px;
5. line-height: 44px;
6. padding: 40px 0 22px 0;
7. }
7. Because we've bumped up the size of the logo quite a bit, let's add a margin to
the <h3> element within the <header> element to balance it. We'll do so by pla-
cing a class attribute value of tagline on the <h3> element and then using that
class within our CSS to apply the proper margins.
Let's not forget that the changes to the <h3> element need to happen on every
Click here to view code image
1. <h3 class="tagline" >August 24&ndash;26th &mdash; Chicago, IL</h3>
1. .tagline {
2. margin: 66px 0 22px 0;
3. }
8. After the <h3> element with the class attribute value of tagline comes the
<nav> element. Let's add a class attribute value of primary-nav to the
<nav> element and add font-size and font-weight properties to make the
navigation stand out against the rest of the header.
Search WWH ::

Custom Search