ブラウザのサイズが変更されたときにdivレイヤーが重複しないようにするにはどうすればよいですか？
ここ数週間、レイアウトを適切に設計する方法を学びました。私は基本的に、自分のWebサイトのレイアウトはすべて完璧であり、コーディングをWordpressに転送する準備ができていると思っていました...その後、誤ってWebブラウザーのサイズを変更し、すべてのdivレイヤーが互いに重なり合っていることを発見しました。
これは次のようになります。 
基本的には、絞り出されているのは主に私のコンテンツdivであり、ヘッダー画像とナビゲーション魔女が同じトップdivにあるように見えます。私のフッターも圧縮されています。この問題の解決策をインターネットで検索しましたが、何も見つからないようです。
ブラウザーのサイズが変更されてもdivsが適切な位置にとどまるようにするにはどうすればよいですか？
私はそれを考え出した。私の中央コンテンツマージンの幅は、直接の幅（つまり、500px）ではなく、マージンによって決定されたことがわかります。そのため、ページのサイズが変更されるたびに、ブラウザの側面のマージンがそのままになり、列全体が小さくなりました。余白を取り除き、列をページのどこに配置するかを指定し、その幅を調整するだけで済みました。
walterが言ったように、CSSは役に立ちます。ただし、主な問題は、コンテンツのdivにすべてのコンテンツを含めることができないため、divのコンテンツが他のdivに対してoverflowingになることです。
CSSで、divのオーバーフロープロパティを自動（スクロールバーを表示）または非表示（divの外に出た場合にコンテンツを非表示にする）に設定してみてください。
overflow:auto;
または
overflow:hidden;
幅とフォントサイズをemsで表現します。これが良い計算機です： http://riddle.pl/emcalc/
パーセンテージも機能します。
Stackoverflowでcssを確認し、ここでブラウザーのズームレベルのサイズを変更してみてください。すべてのズームレベルですべてのサイズが適切に変更されることがわかります。
min-widthを試すこともできます。私は中央のdivが流動的でサイドバーが固定幅であると想定しています。
min-width プロパティ。別のオプションは、ビューポートの幅が CSS3 Media Queries でxピクセル未満のときに別のスタイルシートを適用することです。
@media all and (max-width: 30em) {
/* Alternative narrow styles */
}
とか、ぐらい：
<link media="all and (max-width: 30em)"
rel="stylesheet" href="narrow.css" />
CSS3メディアクエリはまだ広くサポートされていません。そのため、window.onresizeイベント。このようなソリューションには jQuery をお勧めします。
DIVコンテナーに幅と高さがある場合も同じ問題がありましたが、最小幅を指定しない限り、幅以外は変更されません。私が抱えていた問題は、divが次の行に移動するブラウザウィンドウを作成するときでした。
コンテナで高さと幅を設定しました。高さを設定する前に、divに高さを決定させました。
CSSの一部を投稿できますか？
最も簡単な方法は、ブラウザウィンドウのサイズがレイアウトのサイズに影響を与えないように、すべての列に比較的正常なwidth設定を与えることです。流動幅の列の動作を取得することはより複雑であり、レイアウトの詳細に依存します。