List-Style not working with custom nav using an HTML block

Permalink
I have created a custom navigation bar using only html and css instead of using an autonav. The autonav simply can't provide the functionality that I need which is really to have a navigation bar that looks like my main navigation bar but where the links all link to a single page instead of individual pages. Problem is this. Everything looks great and works like I need it to but my list-style:none; isn't working. I still get bullets beside my links. I don't when I created it in DW but upon adding my code to an HTML block the bullets appear. I have added list-style:none; to about every section of my code and still no luck Here's the code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
/* reset styles */
html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address, variable, form, fieldset, blockquote {
padding: 0;
margin: 0;
font-size: 100%;
font-weight: normal;
}
table { border-collapse: collapse; border-spacing: 0; }
td, th, caption { font-weight: normal; text-align: left; }
img, fieldset { border: 0; }
ol { padding-left: 1.4em; list-style: decimal; }
ul { padding-left: 1.4em; list-style:square; }
q:before, q:after { content:''; }
/* end reset */

ul#nav {
margin-top: 10px;
float:left;
list-style:none;
}

ul#nav ul {
background:#fff;
overflow:hidden;
list-style:none;
}

ul#nav li a {
list-style:none;
display:block;
border: 1px solid #b8b8b8;
padding:10px 10px;
font-family:verdana,helvetica,arial,sans;
font-size: 15px;
text-decoration:none;
color:#000000;
background:#c9c4b4;

}
ul#nav li a:hover
,ul#nav li a:focus {
text-decoration:none;
-moz-text-shadow: 1px 1px 0 #fffffff;
-webkit-text-shadow: 1px 1px 0 #fffffff;
background: #b1aa91; border-color: transparent #d0cdbe #d0cdbe transparent;
}

ul#nav ul ul {
margin-top:0px;
list-style:none;
}
</style>
</head>
<body>
<ul id="nav">
<li><a href="/contact-us">Yaffe Iron & Metal Co., Inc - Muskogee, OK</a></li>
</ul>
</body>
</html>

If anybody can't point me in the right direction that would be awesome.

 
ConcreteOwl replied on at Permalink Reply
ConcreteOwl
Try clearing your browser cache,
I don't see any bullets beside your links!
yaffeweb replied on at Permalink Reply
The particular page I'm referring to ishttp://yaffeco.net/services/ notice under Industrial Services. I guess I should've added that to the main post.

The first section (quikservice) uses an autonav to point to different pages, the second section (industrial) is the custom one with bullet issue.
ConcreteOwl replied on at Permalink Reply
ConcreteOwl
Ah yes, I see you have an inline style on line 269 like this
list-style:square outside none

your line 269 has this code
ul { padding-left: 1.4em; list-style:square; }

Its being caused by your reset css code!
yaffeweb replied on at Permalink Reply
That was part of my reset code which I removed. It fixed my width issue but I still have the bullet.
ConcreteOwl replied on at Permalink Best Answer Reply
ConcreteOwl
In the iGotStyle.css sheet remove line 111 that has
#mainShell ul li
list-style:disc outside none
yaffeweb replied on at Permalink Reply
You my friend deserve a raise! Thanks for the help. I've been trying to use the rigidlight theme and adjust my code to it which has had it's issues, for instance, the bullets. Thanks for the second set of eyes!
ConcreteOwl replied on at Permalink Reply
ConcreteOwl
All I ask is for you to mark my answer "Best Answer"
ConcreteOwl replied on at Permalink Reply
ConcreteOwl
Don't forget on yourhttp://www.yaffeco.net/services/... page you still have the problem on line 269 giving you square bulletts in your main nav..