8. Navigation beautify with CSS
At the top of our page there is a number of links in a list. For the list are bullets and the items are among each other. A different format is required for our navigation menu. Add the code below the last line of your CSS file and view the result.
- When display: inline; Specified for a Li in the stylesheet then makes sure that the bullet list does not come together but next to each other. Also the bullets disappear.
- The margin-left: 20px; Makes sure the items are not against each other but left 20 pixels away now.
- The color specified by the A picker (applies to all anchors/links) makes all anchors/left white.
- The same A picker also specifies a text-decoration property that causes the default line to disappear below each link.
- Finally, a a:hover-kiezer is added which ensures that when a visitor hovers over the link the link gets another (orange in this case) color.