Hide Overflow(ish) text in a cell

How do I keep a cell from being wider than I define?

[gotrevgo]

Hello all!

I'm trying to accomplish something simple yet complicated. I think I know how, but I'm open to any simpler suggestions. First, I have a table full of info where dome of the data is too wide for the defined pixel size As expected this pushes the cell over and messes everything up. Is there a way to hide this text so that my columns stay the size I define? I tried using the overflow property without any luck.

Basically I'm trying to re-create standard columns with headers that are clickable for sorting. The only complication is that the list will be in a scrolling frame, and the column headers have to be visible at all times. My current solution is to make two tables - one with the actual data, and another anchored to the top with the column headers. Because these are two different tables, they don't match up if the text is wider than the pixel size. Am I going about this the best way or is there something simpler?

Thanks for the help!

[coopersita]

Maybe if you place a div inside the cell, and set that div to be the width of the cell, and put overflow auto to it.

[antidote45]

this should work:

td {
width: 200px;
overflow: hidden;
}

You have to give the container a width where you specify the overflow: hidden. Maybe you had the width in the HTML instead?