Foros del Web » Creando para Internet » CSS »

Scroll dentro de una celda

Estas en el tema de Scroll dentro de una celda en el foro de CSS en Foros del Web. Saludos. Se me plantea una duda, y es si se puede hacer algún tipo de scroll en el contenido de una celda. Sé cómo hacerlo ...
  #1 (permalink)  
Antiguo 22/03/2008, 02:33
 
Fecha de Ingreso: agosto-2003
Mensajes: 324
Antigüedad: 14 años, 4 meses
Puntos: 1
Scroll dentro de una celda

Saludos.
Se me plantea una duda, y es si se puede hacer algún tipo de scroll en el contenido de una celda.

Sé cómo hacerlo en un marco, dentro de un conjunto de marcos, pero ... ¿se puede dentro de una celda? ¿Cómo ?

Gracias
  #2 (permalink)  
Antiguo 22/03/2008, 03:43
Avatar de aloqui  
Fecha de Ingreso: diciembre-2007
Mensajes: 973
Antigüedad: 10 años
Puntos: 24
Re: Scroll dentro de una celda

Puedes hacerlo por ejemplo usando la propiedad: "overflow:auto;"
Lo más recomendable es con CSS. Por ejemplo declaras una clase así:

.conScroll { overflow:auto; text-align:center; height:390px; width:510px; }

Y luego usas dicha clase en las celdas que quieras que tengan scroll:

<td class="conScroll">....</td>
__________________
Grupos de Música
Pop Music Stars
  #3 (permalink)  
Antiguo 22/03/2008, 05:46
 
Fecha de Ingreso: agosto-2003
Mensajes: 324
Antigüedad: 14 años, 4 meses
Puntos: 1
Re: Scroll dentro de una celda

Muchas garcias.. intentaré llevarlo a la práctica
  #4 (permalink)  
Antiguo 22/03/2008, 11:10
 
Fecha de Ingreso: agosto-2003
Mensajes: 324
Antigüedad: 14 años, 4 meses
Puntos: 1
Re: Scroll dentro de una celda

Pues no me ha funcionado ...
Si le meto el contenido a la celda, ésta se agranda, pero luego en el naegador no se mantiene el tamaño ni me muestra el scroll...

¿alguna otra sugerencia?

gracias
  #5 (permalink)  
Antiguo 22/03/2008, 13:00
Avatar de flanagan44  
Fecha de Ingreso: abril-2004
Mensajes: 182
Antigüedad: 13 años, 7 meses
Puntos: 2
Re: Scroll dentro de una celda

Cita:
Iniciado por AJDC Ver Mensaje
Pues no me ha funcionado ...
Si le meto el contenido a la celda, ésta se agranda, pero luego en el naegador no se mantiene el tamaño ni me muestra el scroll...

¿alguna otra sugerencia?

gracias
intenta con overflow:scroll;

y si no como con las capas seguro que funciona podrias hacer algo asi como:

<td><div style:"overflow:scroll;"> CONTENIDO </div></td>

perdona con los errores, pero tendria que ser asi
  #6 (permalink)  
Antiguo 22/03/2008, 15:29
Avatar de Daniel Ulczyk
Moderador
 
Fecha de Ingreso: febrero-2005
Ubicación: Buenos Aires
Mensajes: 9.175
Antigüedad: 12 años, 9 meses
Puntos: 2072
Re: Scroll dentro de una celda

En un ejemplo un poco más completo, aquí se puede ver como insertar un DIV dentro de una celda para que la misma tenga un scroll:

Código HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">

body {
    font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
    font-size: 78%;
}
table {
    width: 90%;
    height: 100%;
    border: 0;
}
#LayerTexto {
    width:100%;
    height:100px;
    z-index:1;
    overflow: auto;
    background-color: #00CCFF;
}

#LayerTexto p {
    font-family: "Times New Roman", Times, serif;
    font-size: 165%;
    padding: 5px 5px 10px 5px;
    letter-spacing: -1px;    
}
td {
    vertical-align: top;
}
.normal {
    height: 100px;
    padding: 5px 5px 10px 5px;
}
.resaltado {
    background-color: #CCFF99;
    padding: 10px 0 10px 5px;
    font-style: italic;

}
</style>
<title>demo scroll en celda</title>
</head>
<body>

<table>
<tr>
<td>La celda adyacente tiene un scroll mediante un div </td>
<td>
<div id="LayerTexto" class="scroll">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Vivamus euismod. Proin ut nisl id sem malesuada ullamcorper. Curabitur sit amet sapien vel enim iaculis sagittis. Aenean id nibh. Nunc aliquam est at tellus. Sed sollicitudin interdum mi. Quisque at mauris vitae lectus accumsan faucibus. Vestibulum at est. Mauris vitae ipsum. Pellentesque at urna. Aliquam nunc. Quisque fermentum, sapien eget adipiscing cursus, sapien quam rutrum nulla, in tempor diam nulla quis nunc. Pellentesque gravida eleifend arcu.</p>
</div></tr>
<tr class="normal">
  <td>La celda adyacente no tiene scroll. </td>
  <td class="resaltado">Esta celda no tiene scroll, no tiene div. Saludos! 
</tr>
</table>
</body>
</html> 
__________________
—Somos lo que hacemos repetidamente. La excelencia, entonces, no es un acto sino un hábito. (Aristóteles dixit)
  #7 (permalink)  
Antiguo 22/03/2008, 16:36
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Re: Scroll dentro de una celda

Sencillo y claro.

Un salvedad: ¿para qué la class="scroll" dentro del div, si luego no se declara?

Mikel.

Última edición por Mikmoro; 22/03/2008 a las 16:46
  #8 (permalink)  
Antiguo 22/03/2008, 16:47
Avatar de Daniel Ulczyk
Moderador
 
Fecha de Ingreso: febrero-2005
Ubicación: Buenos Aires
Mensajes: 9.175
Antigüedad: 12 años, 9 meses
Puntos: 2072
Re: Scroll dentro de una celda

Cierto. No debiera estar presente la class.
Saludos!
__________________
—Somos lo que hacemos repetidamente. La excelencia, entonces, no es un acto sino un hábito. (Aristóteles dixit)
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:06.