How do you stop HTML tables from being propped up by the content?
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?
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.
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.
加载中,请稍侯......
精彩评论