Considerando los detalles agregados recientemente a la pregunta, en lugar de usar overflow
lo que se require es ajustar el tamaño del div para evitar el desbordamiento, pero esto no se puede hacer directamente, lo primero sería "quebrar" la "palabra"
En CSS el atributo para ajustar cadenas de texto es word-wrap
. En este caso, la cadena no tiene espacios en blanco por lo que se considera que la cadena es una palabra, entonces deberemos usar word-wrap: word-break
.
Como se indica en la respuesta de Gustavo García, si se desea que el div crezca verticalmente no deberían usarse un valor fijo para height
. Existen varias alternativas, una de tantas es usar height: auto
para ajustar automáticamente el tamaño.
Quedaría de la siguiente forma:
div {
background:red;
width: 100px;
/* Control de la altura con base en el texto del div*/
height: auto;
word-wrap: break-word;
}
<div>holaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
Respuesta a con base en la revisión 1
Agrega overflow: hidden;
Puedes consultar la documentación en overflow.
Ejemplo
div {
overflow: hidden;
background:red;
height: 100px;
width: 100px;
}
<div>holaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
overflow
.height
, si nomin-height
para darle un alto inicial. Mira mi respuesta.height
comoauto;
, mira mi respuesta