長いテキストを含む表の垂直スクロールを防止するにはどうすればよいですか？

ビルドソフトウェアには、テーブルを使用してビルドステータスを報告するWebインターフェイスがあります。ビルドが保留中の場合、内部テーブルに最後のログメッセージが出力されます。これらのログメッセージは、非常に長くなる可能性があります。長いテキストを含む表の垂直スクロールを防止するにはどうすればよいですか？

これは、放出されたHTMLの蒸留バージョンです：

<html> 
<head> 
</head> 
<body> 
    <table id="StatusGrid" class="SortableGrid"> 
    <tr> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
     <td>4</td> 
     <td>5</td> 
     <td>6</td> 
     <td>7</td> 
     <td>8</td> 
     <td>9</td> 
     <td>10</td> 
     <td>11</td> 
    </tr> 
    <tr class="buildstatus"> 
     <td colspan="11"> 
      <table> 
      <tr> 
       <td>hello</td> 
       <td>...........................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................................</td> 
      </tr> 
      </table> 
     </td> 
    </tr> 
    </table> 
</body> 
</html>

ブラウザでこのHTMLを表示する場合は、テーブルの内容全体を見るためにスクロール垂直方向にする必要があります。私はこれを望んでいない。 I 決してテーブルをブラウザウィンドウの垂直幅の外側に広げたい。私は内側のテーブルの余分なテキストを切り捨てる/切り取っても構いません。

私はword-break: break-allを試しましたが、これはChromeでのみ動作します。 私はIE 9とChromeとFirefoxの最新バージョンをサポートする必要があります。

最終的なシワ：私はこのを修正するためにCSSを使用する必要があります。私はアプリケーションのスタイルシートにのみアクセスでき、HTMLはアクセスできません。

あなたはどう思いますか？可能？

出典

2012-02-09 Aaron Jensen

tdに固定高さを置き、オーバーフローまたはオーバーフロー-yを非表示に設定してください。

tr.buildstatus td{ 
    height: 500px; 
    width: 600px; 
    overflow:hidden; /* or overflow-y:hidden; */ 
}

出典

2012-02-09 02:06:50 jerjer

FYIこれは、その行のすべてのTDに影響します。 –

これはうまくいくはずです。あなたはあなたの味に高さ/幅を調整しなければならないかもしれません。

tr.buildstatus tr td + td { 
    height:100px; 
    width:200px; 
    overflow:hidden; 
} 
table { 
    table-layout:fixed; 
    width:600px; 
    height:200px; 
}

ライブ例：http://jsfiddle.net/R8nmk/

出典

2012-02-09 02:08:53

はoverflow: hiddenを試してみてください。
オーバーフローがクリッピングされ、残りのコンテンツが非表示になります。
オーバーフローの詳細here

出典

2012-02-19 01:40:36

長いテキストを含む表の垂直スクロールを防止するにはどうすればよいですか？

答えて

関連する問題