Pongamos el caso que tenés la siguiente tabla:
<table>
<tr>
<td>celda1</td>
<td>El texto en esta celda puede ser tan amplio como quieras, que el scroll vertical está controlado por CSS </td>
</tr>
<tr>
<td>celda3</td>
<td>celda4;</td>
</tr>
</table>
El texto que está incluído en la celda3, es tan extenso como quieras y necesitás que la tabla se mantenga con altura de celdas homogéneas.
Encerrás entonces dicho texto dentro de un tag, del tipo div; que para nuestro ejemplo llamaremos scroll. La celda queda de la siguiente manera:
<td><div class="scroll">El texto en esta celda puede ser tan amplio como quieras, que el scroll vertical está controlado por CSS </div></td>
Ahora bien, entre las etiquetas <head></head> insertamos el código CSS que dará forma a la tabla, la celda y el layer o div (capa):
<style type="text/css" media="screen">
table {
width: 220px;
}
td {
height: 50px;
background-color: #FFCC00;
width: 110px;
}
.scroll {
height: 100%;
overflow: auto;
}
</style>
Para un ejemplo final, el código completo quedaría así:
<!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" />
<title>Scroll en celda</title>
<style type="text/css" media="screen">
table {
width: 220px;
}
td {
height: 50px;
background-color: #FFCC00;
width: 110px;
}
.scroll {
height: 100%;
overflow: auto;
}
</style>
</head>
<body>
<table>
<tr>
<td>celda1</td>
<td><div class="scroll">El texto en esta celda puede ser tan amplio como quieras, que el scroll vertical está controlado por CSS </div></td>
</tr>
<tr>
<td>celda3</td>
<td>celda4;</td>
</tr>
</table>
</body>
</html>
Suerte!
