#1 problema width 100%
Estoy tratando de agregar un menu con css, pero al ponerle 100% de largo se pasa... este problema no sucede con chrome y safari, pero si en los demas...
Les dejo la hoja de estilo
y aquí el html
Ya probe con widht 99%, que fue algo satisfactorio, pero me gustaría saber si hay otra solucion
En otro foro me sugirieron algunas cosas como: al div quitarle el padding, ponerle margin a 5px, y ese div, dentro de otro a 100% ancho... tambien me sugirieron cambiar relative por absolute en position.. pero no funcionaron
Les dejo la hoja de estilo
Código:
.lavaLamp {
position: relative;
width: 100%;
background: #333333 url(menu_bg.png) center repeat-x;
padding: 5px;
margin: 0;
overflow: hidden;
}
.lavaLamp li {
float: right;
list-style: none;
}
.lavaLamp li.back {
background: url("lava.gif") no-repeat right -30px;
width: 9px; height: 30px;
z-index: 8;
position: absolute;
}
.lavaLamp li.back .left {
background: url("lava.gif") no-repeat top left;
height: 30px;
margin-right: 9px; /* 7px is the width of the rounded shape */
}
.lavaLamp li a {
font: bold 14px arial;
text-decoration: none;
color: #fff;
outline: none;
text-align: center;
top: 7px;
text-transform: uppercase;
letter-spacing: 0;
z-index: 10;
display: block;
float: left;
height: 30px;
position: relative;
overflow: hidden;
margin: auto 10px;
}
.lavaLamp li a:hover, .lavaLamp li a:active, .lavaLamp li a:visited {
border: none;
}
/* Esto es aparte img y body, pero les dejo por si ahi esta el error */
img {
border: none;
}
body {
margin: 0px;
padding: 0px;
}
Código HTML:
<div style="text-align: center;"> <ul class="lavaLamp"> <li><a href="#"><img src="calendar.gif" /> Home</a></li> <li><a href="#"><img src="help.gif" /> Plant a tree</a></li> <li><a href="#"><img src="memberlist.gif" /> Travel</a></li> <li><a href="#"><img src="search.gif" /> Ride an elephant</a></li> </ul> </div>
En otro foro me sugirieron algunas cosas como: al div quitarle el padding, ponerle margin a 5px, y ese div, dentro de otro a 100% ancho... tambien me sugirieron cambiar relative por absolute en position.. pero no funcionaron
0
