barra de desplazamiento para una celda de tabla

¿Hay alguna manera de agregar una barra de desplazamiento a una etiqueta ‘td’? Tengo un contenido dinámico dentro de una etiqueta ‘td’. Quiero que ‘td’ tenga un tamaño fijo y si el contenido se vuelve más grande que el tamaño ‘td’, quiero que aparezca una barra de desplazamiento solo en esa celda en particular. ¿Hay una manera de lograr esto?

Si tu puedes hacerlo.

La forma más fácil es poner dentro de su celda un div llenándolo y establecer su overflow propiedad de estilo.

CSS:

div.scrollable {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    overflow: auto;
}

html:

<td><div class=scrollable>
    Some content with a scrollbar if it's too big for the cell
</div></td>

Si desea que la barra de desplazamiento esté siempre visible, incluso cuando el contenido no esté recortado, reemplace auto con scroll en el CSS.

Demostración

<table  width ="400" >
    <tr>
        <td >
            <div style="width:100%; max-height:300px; overflow:auto">Your content here 
             </div>
        </td>
    </tr>
</table>

http://jsfiddle.net/7T2S4/1/

Espero que esto ayude

Debe proporcionar “alto” o “ancho” del elemento div, para que se desplace en consecuencia. por ejemplo, desea aplicar Desplazamiento vertical (eje Y): –

<td><div class="scrollable">
    Some content with a scrollbar if it's not fit in your customized container
</div></td>

div.scrollable
{
width:100%;
height: 100px;
margin: 0;
padding: 0;
overflow-y: scroll
}