メイン会場であるHTMLのテーブルtaintingのレイアウトその他
-
13-09-2019 - |
質問
私はhtmlのテーブルとしてレイアウトページに悪い習い).このテーブルが何かのようになります:
Label1 Value1
Label2 Value2
Label3 Value3
Label4 Value4a Value4b Value4c Value4d
私として追加され検証エラーメッセージできる非常に大きなラインからかもしれないけど、僕、現在では:
Label1 Value1 ErrorMessage
Label2 Value2
Label3 Value3
Label4 Value4a Value4b Value4c Value4d
のデザインを描いたところcolspanの細胞の検証メッセージで、全体に及ぶ。この作品データ抽出処理がエラーメッセージの長さの小さなオーバーフローの表に示す。その他取得します:
Label1 Value1 Veeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeery long ErrorMessage
Label2 Value2
Label3 Value3
Label4 Value4a Value4b Value4c Value4d
ライン4はめちゃめちゃです。があるかどうかを指定しますエラーメッセージの細胞内容はオーバーフローのテーブルではなく、拡大のスペースその他の細胞と同じカラム?もしかしたマジックCSS?
解決
のテキストの拡張外にテーブル、テキスト要素のいずれかにより高いレベル(階層)のテーブル、位置づけと関係なく、表に示す。
すで実現できることの後にそのようなもの:
Label1 Value1 <span class="outside">Veeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeery long ErrorMessage</span>
Label2 Value2
Label3 Value3
Label4 Value4a Value4b Value4c Value4d
その外側のクラス:
.outside
{
position:absolute;
}
まいさのフォーマットすることが示、訂正ます。
編集:
はなのフォーマット掃除モーターパラグライダーをご利用の場合ノゼのアイデアとスパンの代わりにdiv.
table
{
table-layout:fixed;
width:100em;
}
他のヒント
[OK]を、ここで私がテストをしたソリューションだとFirefox 3で動作します:
<style type="text/css">
#error {
width: inherit;
overflow: auto;
padding: 0;
margin: 0;
}
</style>
<table width="400">
<tr>
<td width="100">A</td>
<td colspan="3" width="300">
<div id="error">Really long line...</div>
</td>
</tr>
<tr>
<td>1A</td>
<td>1B</td>
<td>1C</td>
<td>1D</td>
</tr>
<tr>
<td>2A</td>
<td>2B</td>
<td>2C</td>
<td>2D</td>
</tr>
</table>
所属していません StackOverflow