Line 453: | Line 453: | ||
} | } | ||
− | . | + | .nav ul { |
list-style: none; | list-style: none; | ||
background-color: #444; | background-color: #444; | ||
Line 460: | Line 460: | ||
margin: 0; | margin: 0; | ||
} | } | ||
− | . | + | .nav li { |
font-family: 'Oswald', sans-serif; | font-family: 'Oswald', sans-serif; | ||
font-size: 1.2em; | font-size: 1.2em; | ||
Line 468: | Line 468: | ||
} | } | ||
− | . | + | .nav a { |
text-decoration: none; | text-decoration: none; | ||
color: #fff; | color: #fff; | ||
Line 475: | Line 475: | ||
} | } | ||
− | . | + | .nav a:hover { |
background-color: #005f5f; | background-color: #005f5f; | ||
} | } | ||
− | . | + | .nav a.active { |
background-color: #fff; | background-color: #fff; | ||
color: #444; | color: #444; | ||
Line 486: | Line 486: | ||
@media screen and (min-width: 600px) { | @media screen and (min-width: 600px) { | ||
− | . | + | .nav li { |
width: 120px; | width: 120px; | ||
border-bottom: none; | border-bottom: none; | ||
Line 499: | Line 499: | ||
margin-right: -4px; | margin-right: -4px; | ||
} | } | ||
+ | |||
+ | /* Options 2 - Float | ||
+ | .nav li { | ||
+ | float: left; | ||
+ | } | ||
+ | .nav ul { | ||
+ | overflow: auto; | ||
+ | width: 600px; | ||
+ | margin: 0 auto; | ||
+ | } | ||
+ | .nav { | ||
+ | background-color: #444; | ||
+ | } | ||
+ | */ | ||
} | } | ||
+ | } | ||
+ | |||
Line 523: | Line 539: | ||
<body class="news"> | <body class="news"> | ||
<header> | <header> | ||
− | <div class=" | + | <div class="nav"> |
<ul> | <ul> | ||
<li class="home"><a href="#">Home</a></li> | <li class="home"><a href="#">Home</a></li> |
Revision as of 19:23, 14 June 2017
/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////