Nagging overflow won't go away! I think anyway

Ok this should be so easy.

http://www.adamtelco.com/at-t-synapse-sb67040-accessory-handset.html

two columns driven by a table. The left side set to exactly 390 and the right set to 610.

The issue is the additional information table on the left side.
In FF everything works great, but in IE the links in that box absolutely will not wrap.

On one computer of mine in IE, the box completely overflows onto the right hand column. On another it simply pushes the right side over.

Anyone got any ideas here?:injured:

Hi,

Try this:


.data-table{word-wrap:break-word}

If that doesn’t wrap then you may need to insert a div inside the td and apply the rule to the div instead.

No browsers handle unbroken text very well and word-wrap:break-word is part of css3 but has been proprietary in Ie for years although it is a bit buggy in tables.

yeah matter of fact, I like the content clipped a little I think. They are just links

Try giving the table cells a max-width. That seemed to do the trick in Firebug.

That’s strange because I copied your whole page locally and tested out before posting and it worked in all versions of IE and looked exactly like Firefox!

The table probably also needed “table-layout:fixed” added to it to make the words wrap and to adhere to the column widths.

Glad you got something working although ellipses clips the content but I guess that’s not a problem.

i guess i could shorten every url that is shows… thats a lot of work though.

lol… it’s like having a conversation in my head… sometimes theres just that extra thought.

im starting to think it’s just the content period…

i guess i can shorten the urls… but i dont usnderstand why they wont wrap…

here’s another http://www.adamtelco.com/intellitouch-ohp8000-on-hold-player.html

Also try to avoid posting every 4 minutes, edit your posts if you must add something on, although I’m glad you got it working :slight_smile:

there has just gotta be something im missing

I tried that to no avail. in both ways. in the css file and directly to a div tag inside the TD

grr

dood… i think you just bonked it right on the boggin!

.data-table .shorten {overflow: hidden; text-overflow:ellipsis; width:249px; white-space:normal;}
<td class="data" width="273"><div class="shorten">the goods</div></td>

Ok changing like so…

<td class="data" width="273"><div style="width:249px;">DATA</div></td>

Worked in IE 8 on my win 7 box but on my xp box in IE8, the words wrap but the box itself is still as long as it was… its so weird!

this is the dumbest thing i have ever seen!

You could set overflow to ellipsis. That will add ‘…’ for anything overflowing.

do you mean by physically shortening the visible portion of the url?

nothing seems to be solving the issue. sheesh