Cómo crear una celda de tabla que se desplaza cuando se desborda

Question

Debo crear una celda de tabla con una altura y ancho fijos, pero con mucho contenido; algo usando overflow: auto. El problema es que no puedo usar display: block en una celda de la tabla (que tipo de rompe el diseño de la mesa) así que he intentado esto:

height: 100px; 
overflow: auto; 
position: relative; 
width: 1280px; 

Pero no está funcionando. Aquí está mi marcado:

 <tr> 
      <td colspan="3" style="width: 1280px; overflow:auto;"> 
       {assign var="latime" value=$agenda|@count} 
       {assign var="latime" value=$latime*150} 
       <div style="width: 1280px; position: relative; overflow: auto; "> 
        <div style="width: {$latime}px; height: 100px; position:relative;"> 
         {assign var="i" value=0} 
         {foreach from=$agenda item=ag} 
          {assign var="img" value=$agenda[$i][3]} 
           &nbsp; &nbsp;<img src="{$img}" id="imag{$i}" onclick='schimbaslidetoti({$i})' />&nbsp; &nbsp; 
          {assign var="i" value=$i+1}  
         {/foreach} 
        </div> 
       </div> 
      </td> 
     </tr> 

Answer 1

Puede anidar un div a nivel de bloque con el overflow: scroll propiedad ubicada dentro de la celda de la tabla. es decir

<td><div style="overflow:scroll;">Content</div></td>