html - Make divs inside table cells the same height without javascript -

i make 2 divs contained in table cells in shared row both have height of taller div. without js. here fiddle simplified example: http://jsfiddle.net/lem53dn7/1/

here code fiddle:

html

<table>     <tr>         <td>             <div>small content</div>         </td>         <td>             <div>this longer content wrap.                  want other div same height one.</div>         </td>     </tr> </table> 

css

table{     width: 200px;     table-layout: fixed; } div {     border: 1px solid black; } 

add following properties div rule:

height: 100%; display: inline-block; 

updated fiddle.