私は CMS テンプレートに取り組んでおり、これが可能かどうかを調べようとしています。ネット上で何も見つけることができませんでした。間違ったキーワードを使用しただけかもしれません。
このモデルを与えます:
http://img833.imageshack.us/img833/4979/alignmentmockup.jpg
<div> #1左揃えの固定「バナー」コンテナです。
<div> #2固定幅の別のコンテナです。サイト全体を測定値 (スケール #2) として使用して中心に配置する必要がありますが、<div> #1(スケール #1) と重なってはなりません。
問題: ブラウザ ウィンドウが小さすぎる場合 (モバイル ブラウザのサイズ変更など)、コンテナが<div> #1. Z インデックスに応じて、一方が他方の上に表示されます。
アプローチ 1 : 両方のコンテナーが同じ z-index にあります。<div> #2持っていますmargin:0 auto;
が、それはそれらが重複するのを止めません。
アプローチ 2 : 両方ともスタイルposition: relative; float: left; z-index: 10
が <div> #2設定されていますが、Web サイトの中心に配置されていません。
これは私が取り組んでいる制限付きのテンプレート バックエンドであるため、必要に応じてコンテナーを追加することはできません。私は、HTML ファイルの<body>と Web サイト機能の最初の部分にしかアクセスできません。したがって、個別<div>の s ( など<div> #1) のみを追加できますが、それらを Web サイトの残りの部分 ( など<div> #2) にカスケードすることはできません。
別のアプローチのヒントをいただければ幸いです。