テーブルを含む HTML ページがあります。テーブルは、サーバー側のデータベースから動的に生成されます。表の幅でページ全体の幅を決定したいと思います。つまり、表の上下にある他のブロック要素は、表と同じ幅にする必要があります。
固定幅を使用したくありません。私は純粋な css ソリューションを好みますが、JavaScript で何かをごまかすことが唯一の方法である場合は、それで構いません。かなり幅広いブラウザ サポートが必要です。
テーブルと他のブロック要素の周りにdiv
withを使用してみました。display: inline-block
アイデアはdiv
、テーブルの周りに「収まるように縮小」し、それによって他の要素の幅を設定することでした。div
これは機能しませんでした。これは、内部のどの要素を「マスター」にする必要があるかがわからず、他の要素の幅を決定しているためだと思います。
編集:フィドルを追加しました:http://jsfiddle.net/5Z3ru/。この例では、表の上の段落を表と同じ幅にしたいと考えています (逆ではありません)。表または段落に固定幅を使用したくありません。
編集 2 : 概念的には、私が探しているものは、テーブルが別のドキュメントで単独でレンダリングされているかのように想像できます。次に、レンダリングされたテーブルが新しいドキュメントに挿入され、レンダリングされたテーブルの幅が新しいドキュメントの幅の設定に使用されます。そのため、最終的なドキュメントはテーブルのレンダリングに影響を与えず、テーブルの幅が最終的なドキュメントの幅を決定する唯一の要因になります。