overflow: auto

pabloturchi · #1 (**permalink**) 13/05/2009, 16:42

Hola a todos. Ante todo gracias. Mi problema es que tengo lo siguiente:
#tablaint_consejos {
width:435px;
height:100px;
overflow:auto;
z-index:3;
text-align: left;
padding-left: 0px;
}

tablaint_consejos es un div que puede tener diferentes textos. El overflow:auto hace, por supuesto que si el texto excede las dimensiones del div, aparezcan las barras. Hasta aqui todo perfecto. Pero, y en todos los navegadores, si el texto tiene "casi" la altura del div, es decir, no llega, pero es muy cercana, las barras aparecen igual. Y el usuario, logicamente, me dice que saque las barras. Pero el overflow:auto no puedo sacarlo porque segun donde clickee el usuario sele ponen distintos contenidos, algunos esceden, otros no, y otros, "casi llegan al limite". Mi teoria, no confirmada por supuesto, es que si el texto, tiene la algun pixel mas (de altura) que la barra (sin incluir las flechas) la barra aparece.
Alguien sabe como hacer que no aparezca la barra si no es "estrictamente necesario". Gracias desde ya.

daPhyre · #2 (**permalink**) 13/05/2009, 23:10

Toma en cuenta que los textos tienen padding, margin y otros espacios que hacen que este aparezca en dado caso. Yo creo que eliminando todo esto se solucionaría, aunque no lo va a dejar nada atractivo...

pabloturchi · #3 (**permalink**) 14/05/2009, 05:37

Yo probe sacandole padding, margin y border, pero pasa lo mismo. Me falta sacarle algo mas??

Mikmoro · #4 (**permalink**) 14/05/2009, 06:53

Añádele un padding-bottom, de manera que la caja siempre tenga algo más de altura por abajo para dejar margen con el texto antes de que aparezca el scroll.

pabloturchi · #5 (**permalink**) 14/05/2009, 06:55

ok, gracias. Hoy mismo lo pruebo.

pabloturchi · #6 (**permalink**) 14/05/2009, 13:59

Lo probe y me di cuenta lo siguiente. En Mozilla y Safari, por ejemplo, las barras (con overflow:auto) se muestran solo cuando el texto sobrepasa los limites del div. pero en IE 6 y 7 las barras aparecen incluso cuando el texto ocupa un 80% del div. en este caso no seria necesario. No puedo hacer una regla que tome el internet explorer solo porque el contenido del div va cambiando. Pero puedo hacer algo para que aparezca solo cuando el texto ocupa mas y no "cuando esta cerca de llenarlo"?? Gracias.

Mikmoro · #7 (**permalink**) 14/05/2009, 15:04

Pues lo siento pero no te entiendo. Mira este ejemplo: el scroll aparece exactamente en el mismo momento en IE6 que en Firefox 2

Cita:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es-es" lang="es-es">
<head>
<style type="text/css">
#texto {
width:435px;
height:100px;
overflow:auto;
z-index:3;
text-align: left;
padding-left: 0px;
border: 1px solid #f00;
}
</style>
</head>
<body>
<div id="texto">bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla
</div>
</body>
</html>

pabloturchi · #8 (**permalink**) 14/05/2009, 15:23

Gracias por ocuparte. tenia un ejemplo en el cual aparecian en distintos momentos pero al no poder resolverlo lo hice cambiando el estilo con javascript cuando me convenia. De todas maneras tomo esto que me muestras porque indica que seguramente habia algo mal en lo que yo tenia. Muchas gracias.