Bueno amigo eso me funciono super bien salvo por un par de cosas, que por ahi vos sabras como se puede hacer
la cosa es que ahora me queda me queda como si fueran pestañas y lo que necesito es que sea como lo que esta en la pagina que deje que lo que vendria a ser pestañas este dentro y que siempre esten visibles sea cual sea la imagen de fondo se vean las dos pestañas he intentado un par de cosas pero no me funcionan
dejo el codigo por las moscas
css
Código:
* { PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; outline: 0px }
HTML { WIDTH: 100%; HEIGHT: 100% }
BODY { WIDTH: 100%; : 100% }
#contenedor { width: 840px; height: 350px; padding: 0px 20px 0px 20px; POSITION: relative; }
#contenido { width: 838px; height: 350px; top:-135px; left: 0px; !important POSITION: absolute; }
#explicacion { MARGIN: 0px }
UL { width: 838px; height: 135px; LIST-STYLE-TYPE: none; }
LI { width: 272px; height: 135px; FLOAT: left; }
A { width: 272px; height: 135px; DISPLAY: inline-block; background: url(FCSS - Hosting_archivos/btoPub_link.png) no-repeat; }
A:hover { POSITION: relative; background: url(FCSS - Hosting_archivos/btoPub_hover.png) no-repeat; }
A SPAN.solapa { WIDTH: 838px; height: 135px; DISPLAY: none; LEFT: 18px; POSITION: absolute; TOP: 21px; }
A:hover SPAN.solapa { DISPLAY: block }
SPAN.texto_tab { DISPLAY: block; LEFT: 0px; }
P { DISPLAY: block; }
#texto1 { LEFT: 0px; TOP: -67px; }
#texto2 { LEFT: -272px; TOP: -67px; }
#texto3 { LEFT: -544px; TOP: -67px; }
#texto4 { LEFT: 0px; }
html
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html4...1224/loose.dtd">
<HTML lang=es-es xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>FCSS - Hosting</TITLE>
<META http-equiv=content-type content="text/html; charset=iso-8859-1"><LINK
media=all href="FCSS%20-%20Hosting_archivos/solapashover.css" type=text/css
rel=stylesheet>
<META content="MSHTML 6.00.6000.16640" name=GENERATOR></HEAD>
<BODY>
<DIV id=contenedor>
<UL>
<LI>
<A href="#">
<SPAN class="solapa" id="texto1">
<SPAN class=texto_tab><img src="FCSS - Hosting_archivos/Publi1.png"></SPAN>
</SPAN>
<img src="FCSS - Hosting_archivos/5mini.jpg">
</A>
</LI>
<LI>
<A href="#">
<SPAN class=solapa id=texto2>
<SPAN class=texto_tab>
<img src="FCSS - Hosting_archivos/Publi02.png">
</SPAN>
</SPAN>
<img src="FCSS - Hosting_archivos/9mini.jpg">
</A>
</LI>
<LI>
<A href="#">
<SPAN class=solapa id=texto3>
<SPAN class=texto_tab>
<img src="FCSS - Hosting_archivos/publi03.png">
</SPAN>
</SPAN>
<img src="FCSS - Hosting_archivos/10mini.jpg">
</A>
</LI>
</UL>
<DIV id=contenido>
<DIV id=explicacion></DIV>
</DIV>
</DIV>
</BODY>
</HTML>
espero puedas darme una mano
gracias