Hola foreros, traigo una duda sobre compatiblidades con navegadores, a ver si alguien me pudiera ayudar. De momento no es algo muy critico.
El caso es que estoy haciendo una web, pero lo he probado en otro ordenador y no aparece de la misma manera (es un mac y el fallo aparece en todos los navegadores, firefox, internet explorer...)
Ahora mismo a mi se me ve asi
y en el otro ordenador se ve asi
Como podeis observar, la botonera no llega hasta el final de donde derberia llegar. Estaba pensando cual seria la manera de concebirla como un bloque ella entera y aplicar un valor de porcentaje de largada (así, se ajustaria sola si tuviera la necesidad).
El código CSS que he usado para la botonera es el siguiente
Código:
<style type="text/css">
* {padding: 0; margin: 0;}
p {color:#7D7E7C;}
body {font:11px Verdana,Arial; background:#FFFFFF;}
ul.menu {list-style:none; margin: 0 auto; padding:0px; width: 782px; }
ul.menu * {margin:0; padding:0; font:11px Verdana,Arial; background:#FFFFFF;}
ul.menu a {display:block; color:#FFFFFF; text-decoration:none;}
ul.menu li {position:relative; float:left; margin-right:0px; border-left:1px solid #005622;}
ul.menu ul {position:absolute; top:26px; left:0; background:#008A00; display:none; opacity:0; list-style:none;}
ul.menu ul li {position:relative; border:1px solid #005622; border-top:0px; width:160px; margin:0;}
ul.menu ul li a {display:block; padding:3px 7px 5px; background-color:#008A00;}
ul.menu ul li a:hover {background:url(images/header_over.gif);}
ul.menu ul ul {left:148px; top:-1px;}
ul.menu .menulink { border:0px solid #aaa; padding:5px 22px 7px 22px; font-weight:bold; background:url(images/header.gif)}
ul.menu .menulink:hover, ul.menu .menuhover {background:url(images/header_over.gif)}
ul.menu .sub {}
ul.menu .topline {border-top:1px solid #aaa}
</style>
Si alguien me pudiera ayudar estaria muy agradecido, las compatiblidades entre navegadores son una verdadera pesadilla!
Un saludo, y gracias de antemano. Adiós!