3

I have some text in table column which is greater than the column width I want. So text is overflowing from it. So I apply overflow:auto but in this case it is showing scroll on every page where data is less than the width of the column.

I don't want to show the scroll on that page where data is less than the width of column just want to show only where data is greater than its length.

Does any one have some suggestions?

<td  style=" width:50%;overflow:auto;>
stema
  • 90,351
  • 20
  • 107
  • 135
BASEER HAIDER JAFRI
  • 939
  • 1
  • 17
  • 35
  • Try to wrap td content in div with fixed width and overflow: auto. – rogal111 Nov 24 '11 at 10:32
  • I've added answer, vote this please. – rogal111 Nov 24 '11 at 11:11
  • hey firefox is not implementing word-wrap how to deal with it??? – BASEER HAIDER JAFRI Nov 25 '11 at 06:43
  • word-wrap should work in firefox, if you have very long words without spaces you can use `text-overflow: ellipsis` ([link](http://www.quirksmode.org/css/textoverflow.html), [link2](http://stackoverflow.com/questions/1820384/how-can-i-mimic-text-overflow-ellipsis-in-firefox) - for previous versions of firefox) – rogal111 Nov 25 '11 at 09:09

2 Answers2

2

Try to wrap td content in div with fixed width and overflow: auto

For example:

<table>
  <tr>
    <td>some content</td>
    <td>  <!-- your fixed width column -->
       <div style="width: 100px; overflow: scroll;">
          Loremipsumdolorsitametconsectetuadipisicingelit
       </div>
    </td>
  </tr>
</table>
rogal111
  • 5,874
  • 2
  • 27
  • 33
1
use this <td  style=" width:50%;overflow:scroll;"> 
This will insert horizontal and vertical scrollbars.
They will become active only if the content requires it.
dku.rajkumar
  • 18,414
  • 7
  • 41
  • 58