<div id="header">
<div id="logo">
<img src="images/logo.png" alt="Artekasa Logo">
</div>
<div id="tabs">
<ul>
<li><a href="catalogo.html" title="Cátalogo"><span>Cátalogo</span></a></li>
<li><a href="ubicacion.html" title="Ubicación"><span>Ubicación</span></a></li>
<li><a href="contacto.html" title="Contáctenos"><span>Contáctenos</span></a></li>
<li><a href="index.html" title="Inicio"><span>Inicio</span></a></li>
</ul></div>
</div>
Note: This tab code is not mine, I got it off the web
#header {
margin:0;
padding:0;
}
#logo {
margin-left: 3em;
padding:0;
height:auto;
background-color:#fff;
}
#tabs {
font-size:93%;
padding:0;
margin-right:5em;
}
#tabs ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
#tabs li {
display:inline;
margin:0;
padding:0;
}
#tabs a {
float:right;
background:url("images/tableft3.gif") no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
}
#tabs a span {
display:block;
background:url("images/tabright3.gif") no-repeat right top;
padding:5px 15px 4px 6px;
color:#FFF;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#tabs a span {float:none;}
/* End IE5-Mac hack */
#tabs a:hover span {
color:#FFF;
}
#tabs a:hover {
background-position:0% -42px;
}
#tabs a:hover span {
background-position:100% -42px;
}