This is driving me bonkers. This incredibly simple thing is just not working and I have no idea what I'm missing. The list-style: none and text-decoration: none are having absolutely no effect on the final product run in the browser. The list still has bullets and the links are still underlined. Here's the HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Porshe</title>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"> </script>
<link rel="stylesheet" href="styles/main.css">
</head>
<body>
<header>
<img src="images/logo.jpg" alt="logo"/>
</header>
<nav id="nav1">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="content/cars.html">Our Cars</a></li>
<li><a href="content/staff.html">Our Staff</a></li>
<li><a href="content/accessories.html">Accessories</a></li>
<li><a href="content/locs.html">Our Locations</a></li>
<li><a href="content/sales.html">Sales Events</a></li>
<li><a href="content/contact.html">Contact Us</a></li>
</ul>
</nav>
<section>
</section>
<footer>
</footer>
</body>
</html>
The CSS:
article, aside, figure, footer, header, nav, section {
display: block;
}
html{
background-image: url(../images/gradient_gray-silver1.jpg)
}
body {
font-family: Tahoma;
width: 1000px;
margin: auto;
background-color: white;
}
header img{
display: block;
margin: 0 auto;
nav {
float: left;
}
#nav1 ul{
list-style: none;
}
#nav1 li a{
display: block;
text-decoration: none;
}
You missed }
for header img
in your CSS
header img{
display: block;
margin: 0 auto;
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.