html td word-wrap,html - word-wrap: break-word with div inside td - Stack Overflow

I'm trying to use the CSS word-wrap property with break-word value.

I want to use this inside a td, and apparently need to use a additional div tag for this to work. fine.

I tried to build a simplified use-case:

HTML:

HURTEAUX / Jean-Baptiste mr)

CHEUNJGgdfgdfvfsefsdfsdfsdfsdvvvHJG / Samuel mr

CHEUNG / Samuel mr)

CSS

.sectors td {

border: 1px solid #000;

}

.sectors td div {

width: 150px;

word-wrap: break-word;

border: 1px solid red;

}

The problem

Firefox, Chrome and Safari behave as expected (at least as I expect).

But IE (IE6, IE7, IE8) has a strange behavior: the text is properly wrapped inside the div (red border), but it seems the td (black border) is allocating extra space for no reason.

Any workaround or explanation?