Question

I am having problems with a table.

It’s made of 3 cells each row, each cell has a max width and the text that doesn’t fit in the cells has to be discarded.

I already looked this:

How to limit a table cell to one line of text using CSS?

And I made the code.

http://jsfiddle.net/e3Eqn/222/

The problem is that I don’t understand why Firefox, Chrome, Safari are ok with it and Internet Explorer displays a crazy formatting and does not consider the overflow:hidden!

Answer 1

A common problem again. However there is a easier workaround than to plunge in various techniques instead.

Use this format

<td>
<div>
Your longlonglongcontent
</div>
</td>

Then use this as CSS

td div { width: 100%; overflow: hidden; }

This will work in ff, opera and IE7

See your demo with this hack