hola,
Agradecería si alguién me puede ayudar, necesito saber como se modifica automaticamente el tamaño de una imagen al ancho de un <li> cuando paso el mouse sobre la pagina (li:hover), ya que la imagen se me recorta si la palabra de la pagina es muy pequeña, en caso contrario la imagen sale completa. He probado con background-size: 100%, max widht:100% pero no he conseguido que la imagen se ajuste al tamaño.
en mi html tengo lo siguiente
<li class="noSelected">
<a href="$nav_item.getRegularURL($rquest)">
</li>
---------------------------------------------------------------css
.noSelected a:hover, .noSelected li:hover{
background: url("../images/box.png") no-repeat scroll 50% 100% transparent;
padding: 0px 17px;
color : #FFFFFF;
margin: 1px 0px;
max-width: 100%
}