CSSの位置：固定

Question

私はposition:fixed<div>が画面の中央に表示されています。メッセージがある場合は、最初の<div>の隣に2番目のposition:fixed<div>が置かれます。

私は<div>のお互いの上に座って、さまざまな画面サイズ（ネットブック - 小さな画面など）で見つけることができます。

位置を互いにロックする方法はありますか？私は両方を保持するために固定コンテナを使ってみましたが、まだ移動しました。

<div id="container"> 
    <div id="container"></div> 
    <div id="container"></div> 
</div> 

EDIT：

<div id="wrapper"> 
    <div id="container1"></div> 
    <div id="container2"></div> 
</div> 

CSS - 私は、画面サイズを変更するときcontainer1とにcontainer2はまだ動きます。

#wrapper { 
    position: fixed 
} 
#container1 { 
    position: fixed 
} 
#container2 { 
    position: fixed 
} 

私はコンテナ1/2 divsの相対位置を使用する必要がありますか？

Answer 1

idはユニークです。 3つの異なる要素にid="container"を使用することはできません。それぞれは独自のidを持っている必要があります。

<div id="container"> 
    <div id="container"></div> 
    <div id="container"></div> 
</div> 

は、また、このような何か...

<div id="wrapper"> 
    <div id="container1"></div> 
    <div id="container2"></div> 
</div> 

すべき場所をあなたのCSSのコードはありますか？

ウィンドウのサイズが変わるたびにこれらが互いに押しつけられないようにするには、各コンテナのサイズと位置を正確に指定する方法があります。

EDIT：

は再び、このページ、デモ、またはあなたが何をしたいのより良い記述の例を見ることなく、これは憶測です。

ラッパーに固定位置を入れてから、正確なサイズと位置を<div>の内側に置くことができます。

Answer 2

position: fixed CSSルールは、要素の位置を画面上に「固定」します。一度それをfixedに設定すると、それは入れた位置から決して移動しません。すべての要素にfixedを適用しているので、要素のスタックが表示されています（画面の左上に上または左の値を提供していません）。

子要素を固定されたコンテナ内に表示する場合は、position: fixedを追加しないでください。親要素内に子要素が表示されます。

もちろん、あなたの問題の例や望む結果が見当たらないことを考慮すれば、これはすべて純粋な推測です。

Answer 3

このようにdivの位置を修正することはできません。まずあなたは親divの画面サイズを見つけなければなりません。それにはそのdivが途中で必要です。以下のような

<div id="parent"> <div id="middle_div"></div> </div> 
function getScreenSize() 
{ 
     var winW, winH; 
     winW = document.getElementById('parent').availWidth; 
     winh = document.getElementById('parent').availHeight; 
    } 

これはあなたが親のdivの幅を持っている場合は、div.Thenがit.nowに応じて、親のdivの幅と高さを設定し、親のためのavailabelサイズを取得VIL方法ですそのの真ん中にmiddle_divを設定することは容易親div。