1

Buenas,

Tengo un pequeño problema con la acción overflow: scroll. Esta acción se aplica en un div, que al cargar la página está vacío, y que al rellenar un formulario se muestran los resultados. Es la caja donde se muestran los resultados de una búsqueda, por si puede ayudar a la comprensión.

El caso es que al cargar la página se ve ese pequeño recuadro en blanco debajo de la barra del buscador:

introducir la descripción de la imagen aquí

Cuando se tendría que ver así.

introducir la descripción de la imagen aquí

Necesito usar overflow: scroll debido a que la caja de la búsqueda no quiero que muestre más de 3 resultados en pantalla, y que gracias al scroll, se puedan ver el resto de resultados que coinciden con la búsqueda.

El código HTML:

<form class="busqueda" action="busqueda.php" method="get">
        <input type="text" id="busqueda" name="busqueda" placeholder="Buscar un juego..." autocomplete="off" onKeyUp="buscar();">
        <button type="submit" name="button" class="fa fa-search"></button>
</form>
<div id="resultadoBusqueda"></div>

Código CSS:

#resultadoBusqueda {
z-index: 1000;
background: white;
position: absolute;
top: 50px;
width: 300px;
max-height: 228px;
overflow: scroll;
box-shadow: .1px .1px 2px #888888;

}

¿Hay alguna forma sin complicarse mucho la vida para hacer desaparecer ese recuadro cuando el div resultadoBusqueda esté vacío que va a ser siempre que se cargue la página sin tener que quitar el overflow: scroll?

1
  • 1
    puedes ocultar resultado de busqueda con desde js con resultadoBusqueda.style.display = 'none'; y hacerlo aparecer cuando llenes resultadoBusqueda el 3 may. 2017 a las 22:55

1 respuesta 1

3

proba

#resultadoBusqueda:empty {
   display: none;
}

https://css-tricks.com/almanac/selectors/e/empty/

1
  • ¡Muchas gracias! Ni sabía que existía algo parecido.
    – user27826
    el 4 may. 2017 a las 1:01

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.