I have a table. Its <td>
have overflow: auto
.
The width is set to be 100px. In Firefox only, text that exceeds 100px is not hidden and replaced with a scrollbar.
How can I hide content and have a scrollbar when it exceeds the width of its container?
http://jsfiddle.net/be6tM/10/
this question from here maybe solve your problem
nickb answer: "Try wrapping it in a <div>
. I'm pretty sure the overflow attribute is not defined for a <td>
element, at least in HTML4 it's not."
try to put your overflow:auto
to the wrapper
hope this can help you
pre, div {
width:100%;
overflow: auto !important;
}
working demo
The easier way to do this would be to add this to the Html
<td class="first">
<div>Don ovonMrLongNameIsMe!!!</div>
</td>
and this to the CSS
div {
overflow:auto;
}
td {
border: 1px solid rgb(0,0,0);
min-width: 100px;
max-width: 100px;
}
Working Example:
div {
overflow:auto;
}
td {
border: 1px solid rgb(0,0,0);
min-width: 100px;
max-width: 100px;
}
<table>
<tr>
<td class="first">
<div>Don ovonMrLongNameIsMe!!!</div>
</td>
</tr>
</table>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With