[jimbofoxman]

I see in the css file this: (Website: http://ashwebstudio.com/)

#menu {
background: url(../images/menu.jpg) top left no-repeat;
width: 684px;
height: 40px;
padding: 0px;
margin: 0px;
position: relative;
}
#menu li span {display: none;}
#menu li {margin: 0; padding: 0; list-style: none; position: absolute; top: 0;}

#menu li, #menu a {height: 40px; display: block;}
#menu-1 {left: 60px; width: 90px;}
#menu-2 {left: 150px; width: 91px;}
#menu-3 {left: 241px; width: 102px;}
#menu-4 {left: 343px; width: 102px;}
#menu-5 {left: 445px; width: 79px;}
#menu-6 {left: 524px; width: 106px;}

#menu-1 a:hover {background: transparent url(../images/menu.jpg) -60px -40px no-repeat;}
#menu-2 a:hover {background: transparent url(../images/menu.jpg) -150px -40px no-repeat;}
#menu-3 a:hover {background: transparent url(../images/menu.jpg) -241px -40px no-repeat;}
#menu-4 a:hover {background: transparent url(../images/menu.jpg) -343px -40px no-repeat;}
#menu-5 a:hover {background: transparent url(../images/menu.jpg) -445px -40px no-repeat;}
#menu-6 a:hover {background: transparent url(../images/menu.jpg) -524px -40px no-repeat;}

Then if you go to the page source all I see is this where the top menu is. I was trying to figure out how he did the HOME, ABOUT, etc with the TICK MARKS inbetween.

<div id="main">
<h1><span>San Diego web design company ashwebstudio</span></h1>
<div>
<ul id="menu">
<li id="menu-1"><a href="index.php" title="San Diego web design company homepage"><span>San Diego web design company homepage</span></a></li>
<li id="menu-2"><a href="about.php" title="Web site designer in San Diego Derek Ashauer"><span>Web site designer in San Diego</span></a></li>

<li id="menu-3"><a href="services.php" title="San Diego website design company services"><span>San Diego website design company services</span></a></li>
<li id="menu-4"><a href="portfolio.php" title="Web site design San Diego - Portfolio"><span>Web site design San Diego Portfolio</span></a></li>
<li id="menu-5"><a href="/blog" title="San Diego web design blog"><span>San Diego web design blog</span></a></li>
<li id="menu-6"><a href="contact.php" title="Contact a San Diego web site designer"><span>Contact a San Diego web site designer</span></a></li>
</ul>
</div><!-- END menu -->

[Stickman]

Its just one background image positioned differently for each button.

http://ashwebstudio.com/images/menu.jpg

Easy to do - if you're thinking of having a go.

[jimbofoxman]

LOL, that was stupid. I saw that yesterday too and missed it. THANKS

[Limbo]

Originally Posted by Stickman

Its just one background image positioned differently for each button.

http://ashwebstudio.com/images/menu.jpg

Never thought to use css to rollover like that, v'always separated my images into off and overs, but that's proper simple like, cheers.