tags:

views:

27

answers:

2

With some HTML like this:

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
  <style>
    td {
      width:10px;
    }
  </style>
</head>
<body>
  <table>
    <tr><td>Text</td><td>Text</td><td>Text</td><td>Text</td></tr>
    <tr><td>Text</td><td>Text</td><td>Text</td><td>Text</td></tr>
    <tr><td>WHOA I'M A LONG STRING!</td><td>Text</td><td>Text</td><td>Text</td></tr>    
  </table>
</body>
</html>​

The tds don't get a width of 10px, they are just as long as the longest string in them.

How do you make this work?

A: 

You can change the css to:

max-width: 10px;
overflow: hidden;

but that will chop off the words mid-letter, wherever the edge happens to be.

Marc B
A: 

I think all you could do is wrap the content in a div and give the div a width and overflow:hidden. It cuts off the text (or content), so that may not be what you're looking for.

ScottE