October 27th, 2002, 05:21 PM
|
 |
Contributing User
|
|
Join Date: Jul 2002
Location: St. Louis, MO, 63122
|
|
CSS: need help with a menu seperator
I am pretty new to messing with CSS, so please bear with me. I have a side menu on the site I am designing that is basicly the navigation bar; it is simply a list of links. I am trying to make thin seperator lines between each link, and am running into a bit of trouble. Here is what I have atm:
PHP Code:
body {
margin:20px 20px 0px 20px;
}
#main {
background:#fff;
}
#main #menu {
border-left:1px solid #ccc;
border-right:1px solid #ccc;
border-top:1px solid #ccc;
border-bottom:1px solid #ccc;
float:right;
width:150px;
background:#eee;
margin:0px 0px 10px 10px;
padding-bottom:10px;
}
p,h1,pre {
margin:0px 10px 10px 10px;
}
h1 {
font-size:14px;
padding-top:10px;
}
#menu hr {
width:150px;
color: #ccc;
top-margin:0px;
bottom-margin:0px;
}
#menu p { font-size:10px}
#menu a {
margin: 0px 10px 0px 18px;
color: #777;
text-decoration: none;
width: 100px;
}
#menu a:link {
margin: 0px 10px 0px 18px;
color: #777;
text-decoration: none;
}
#menu a:visited {
margin: 0px 10px 0px 18px;
color: #777;
text-decoration: none;
}
#menu a:hover {
margin: 0px 10px 0px 18px;
color: #000;
text-decoration: none;
}
The section I am dealing with is #menu - I set the HR attributes and am trying to use that as the seperator. The problem I am having is there is about 10x above/below each link, even though I have the margin set on the links/hr to 0 for above/below. Any idea what I am doing wrong? Hope this make sense... thanks alot for taking a look.
Patrick
|
Dev Shed Forums Sponsor:
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
