コンテンツのテーブルを揃える Web サイトを作成しています。1 つのテーブルはナビゲーション バーに使用され、他のテーブルは他のコンテンツに使用されます。とにかく、これらのテーブルをfloat:left;と に設定しましたposition:relative;。
問題は、ブラウザー ウィンドウの位置を変更するたびに、すべてのテーブルが左端のテーブルの下に移動することです。この問題を解決するにはどうすればよいですか? テーブルがお互いの下に移動しないようにしたい。
奇妙な理由で、このアプリケーションではコードを投稿できません。投稿できますが、全体が正しくフォーマットされません。
書式設定にテーブルを使用しないという Diodeus の推奨を含め、Watson は正しいです。ただし、実行している状況を改善する方法の 1 つは、すべてのテーブルを含む要素 (たとえば、 a div) でラップし、すべてのテーブルに必要な幅と同じかそれよりもわずかに大きいwidthまたはcss パラメータを設定することです。min-widthフローティング テーブルが適切な位置に収まるようにします。次に何が起こるかというと、ウィンドウのサイズが必要以上に小さく変更された場合、水平スクロール バーが表示されますが、要素の配置はそのまま残ります。
これは、フローティングされているテーブルの幅が親の幅 (使用可能なスペース) より大きい場合に発生します。余分な幅を追加するパディング、マージン、ボーダーに注意してください。また、Diodeus のアドバイスに従い、レイアウトにテーブルを使用しないでください。