問題タブ [css-tables]

各セルの幅は固定されていますが、絶対的ではあるが高さが変化するテーブルを作成しようとしています。たとえば、最初の列の最初の行は 20px、2 番目は 65px、3 番目は 20px になります。2 列目の最初の行は 20px、2 番目の列は 45px、3 番目の行は 40px になります。最後の列では、最初の行が 20 ピクセル、2 番目の行が 85 ピクセルになります。

表のセルが空であるか、コンテンツに対して十分な大きさである場合、これらはすべて正常に機能します。ただし、コンテンツがセルに収まるサイズよりも大きい場合、行は垂直方向に拡張されますが、余分なコンテンツは非表示にしたいと考えています。

使ってみました

<tr>、> <td、および > 内にコンテンツを配置しながら同じことを行いますが、<div私が探しているものを達成するものはありません。行を拡張するのではなく、余分なコンテンツを非表示にして行の高さを絶対値に制限する方法についてのアイデアはありますか? テーブル内に保持したいのですが、それが不可能で、別の表示手法を使用する必要がある場合は、アイデアを受け入れます。

すべてのテーブル要素（、、など）にCSSアイテムがあり<table>ます<tr>が、CSSを適用したくないテーブルが1つあります。

このテーブルを生のHTMLテーブルとして表示し、CSSフォーマットを適用しないようにする最も簡単な方法は何ですか。

また、CSSファイルには次のようなものがあります。

複数のテーブル形式が必要な場合はどうすればよいですか？

ASP.NET MVCでdivテーブルを使用するためのより良い方法を見つけようとしています。問題は、従来のテーブルを使用する必要がある場合、1つのループではなく、大量のループを実行する必要があることです<table>。

例

次のようなカスケードリストのスタイルを設定する方法があるかどうかを尋ねるだけです。

このようなテーブルに

ここで、各行は同じ幅の水平リストです

私はこれを達成するために実験してきましたが、これまでしか近づくことができません

各セルを同じ幅にすることはできません。これが私のCSSです

これが私のサンプルhtmlです

どんなアイデアでも大歓迎です。

私は解決策を見つけましたが、このスレッドでの回答に感謝したいと思います。解決策は次のようになります。

HTMLは次のようになります

基本的にこれと同じ問題があります-テキストには背景色が設定されており、テーブルセルにあります。テキストの背景色はテキストの後ろにあるだけで、テーブルセル全体を塗りつぶす必要はありません。

解決策は通常、テーブルセルにbgcolorを設定することです。違いは、これはこの特定のWebサイト全体の多くの場所で発生し、関連するすべてのテーブルセルの変更には非常に長い時間がかかることです。

質問は、CSSで次のいずれかを言う方法がありますか？

1. テキストの背景色をテーブルセル全体に塗りつぶします（テキストがテーブルセルにある場合）。また.....
2. テーブルセルにスタイルxのテキスト要素が含まれている場合、そのテーブルセルに背景色（一種の逆継承）を持たせますか？

PS：このサイトは元々IE6用に開発されたもので、IE6はすでにテーブルセル全体をテキストの背景色で塗りつぶしているため、最初は問題ありません。ただし、FFとIE7+の動作は異なります。

CSS プロパティがではoverflow:scroll;うまく機能するのに、なぜ機能しないのですか?<td>overflow:hidden;

CSS 仕様^1、2から、理由がわかりません。

スクロールバーのない高さ/幅が 100% のテーブル ベースのレイアウトがあります。ヘッダー (赤) はコンテンツに合わせて自動的に拡大され、何ピクセルになるかわかりません。以下の流体表は、私が何を正確に示しています。

CSS で同じレイアウトを行い、一般的に使用されるブラウザーで動作させるにはどうすればよいですか?

テーブルベースのレイアウトをまだ使用しているサイトに、CSS ベースのタブ ナビゲーションを追加しています。タブ リストを td 内に配置すると、視覚的な「ギャップ」が表示されます。width: 100% の空の div を td に配置すると、タブ リストが正しく表示されます。（テーブルの外でも問題なく動作します。）

div によってタブが正しくレイアウトされるのはなぜですか? また、コンテンツのない div を追加せずにタブを正しく配置するより良い方法はありますか?

これが私のテストケースです：

これを私のブログにクロスポストしました: Bacon Driven Coding: Why does layout change in IE when UL is alone in a TD vs having an extra empty DIV? 、スクリーンショット付きで、私が話していることを人々が見ることができます。

スクリーンショットは次のとおりです。

多数のテーブルを div に変換しています。レイアウト自体は非常にシンプルで、これまでのところ ie と ffx の両方でうまく機能します。しかし、div のコンテンツが収まらない場合、それはそれから成長し、それ以降のすべてを押し下げます... 他の作品では、めちゃくちゃになります レイアウトはこのようなものです,

右は右にフロートし、タイトルは右の上部にあり、コンテンツはその下にあり、左は左にフロートし、右の高さをスパンします (元は rowspan=2 でした)。問題は、固定の高さが必要なラッパーで発生します。その親には何もないため (したがって、% を使用できません)、コンテンツが動的であるため、必要な高さが事前にわかりません。高さを取り除くと、div が拡張されますが、高さが 0 になったため、div のスタイリング (背景色、境界線など) が消えます。

また、私は既存のコードに取り組んでおり、理想的には JavaScript のハックで混乱させたくないのですが、選択の余地がない場合はそうします。それで、なにかお手伝いできますか？