testndtv testndtv - 9 months ago 49
CSS Question

<Table> cell rendering difference between IE and Firefox

I have a table with cell coded as follows

<td valign="top" class="weekend_days">
<div class="block_out">
<div class="blockout_text">Some content ...Some content ...Some content ...Some content ...Some content ...</div>

In the CSS, I have defined a height for the div as;

.block_out {height: 50px;}

I have just included the relevant style here.

Now in IE, the cell expands if the content increases, but in Firefox, it does not expand if content is more.

How do I fix this issue (I would not be able to directly remove the height attribute as it is used in multiple places) ?

Answer Source

Try this:

.block_out {min-height: 50px;}

Example min-height: http://jsfiddle.net/35bsF/2/

Example height: http://jsfiddle.net/35bsF/3/