« CSS message quoting | Home | Nice CSS tab menu with PHP »

A vertical menu done in CSS

body{
  background: #fff;
  line-height: 1.1;
  color: #666;
  font: small Verdana, Geneva, Arial, Helvetica, sans-serif;
}

  #Navigator {
    width: auto;
    background: #fcfcff ;
    padding: 0 6px .5em 12px;
    overflow: visible;
    min-width:750px;
    clear: both!important;
    top:1em!important;
    margin-bottom:1em!important;
  }
  .fixclear {
    display:block;
    position:relative
  }

  #NavData  {
    float:left;
    clear: left;
    width:225px;
    margin:0;
  }

  div.NavMain {
    background:#FcFcFf;
    position:relative;
    margin-bottom:1em;
    width:auto!important;
    width:100%;
    border:1px solid #CAD6E8 ;
    padding:1em 0 1.5em 0;
   
  }

h2, h3{
  color:#036;
  background: transparent;
  font-family'Trebuchet MS', Arial, Helvetica, sans-serif
}

h4  {
  fontbold 100% Verdana, Arial, Helvetica, sans-serif;
}

a:link{
  color: #06c;
  background: transparent;
}
a:visited{

  color:#4B5970;
  background: transparent;
}
a:hover{
  color: #f60;
  background: transparent;
}

#Navigator div h3  {
  fontnormal .9em Verdana, Arial, Helvetica, sans-serif;
  height:1em;
  padding:2px 1.5em 4px .5em;
  clear: right;
  color:#99ACCA ;
  background:transparent url(bulletr.gif) right center no-repeat;
  margin:0;
  position:absolute;
  right:-1px;
  top:-.8em;
  border:0 none;
}

div.NavMain * {
margin:4px 6px 6px 10px;
}
div.NavMain * * {
margin:0;
}
div.NavMain h4 {
color: #E14900;
}

div.NavMain ul, div.NavMain ol{
margin: 5px 0 10px 5px;
padding:0 0 0 5px;
font-size:77%;
font-weight:bold;
}

div.NavMain li {
margin: 0 5px 5px 18px;
padding:0
}
div.NavMain ul li {
list-style-image: url(Bullet.gif);
}
div.NavMain ul li:hover {
list-style-image:url(Bullet.gif)
}
div.NavMain p {
font-size:77% ;
margin-bottom:10px
}

Topics: css | Submitter: admin

Comments

You must be logged in to post a comment.

Keep on coding