> Faqs > ¿Cómo hacer en CSS que las barras de scroll aparezcan en un elemento, solo en la vertical?

¿Cómo hacer en CSS que las barras de scroll aparezcan en un elemento, solo en la vertical?

Tengo un elemento de la página que tiene más contenido del que puede aparecer en el espacio que le he reservado.

Tengo el estilo de overflow hidden para que no crezca el elemento, porque me rompe el diseño:

element {
    overflow: hidden;
}

Mi problema en este punto es que me gustaría que apareciesen las barras de scroll pero solamente para este elemento, es decir, que tenga una región de scroll específica para este elemento, pero que el scrollo solamente sea en la vertical.

¿Como lo monto con CSS para que aparezcan las barras de scroll solamente en la vertical?

Respuestas

En realidad si usas overflow:hidden lo que estás haciendo es que no aparezcan las barras de scroll.

Si quieres que las barras de scroll aparezcan solamente en la vertical, tienes que usar el atributo overflow-y:

Esa sería la regla para que la barra de scroll aparezca solamente en los casos que deba aparecer realmente. Es decir, si se necesita.

#element {
    overflow-y: auto;
}

Ahora puedes ver otro estilo con el que conseguirías que la barra de scroll esté siempre presente, independientemente de si realmente hace falta (porque el contenido no quepa) o no.

#element {
    overflow-y: scroll;
}

Puedes leerte este artículo con explicaciones detalladas del atributo overflow.

Juanjo
82 3 5
Si usas overflow: auto tambien funfionaria, siempre que el contenido sea adecuado.