問題タブ [css-position]

テーブルを 6px 上に移動しようとしています。

そのすぐ上にテーブルがあるため、オーバーラップする必要があります。これは可能ですか？

私が試してみました

と

私のメニューには、左側に送られる絶対配置のナビゲーションがあります。*

次のようになります。

また、IE6 を除くすべてのブラウザーで、それが行われます。IE6 標準モードでは、次のようになります。

ここがややこしいところです。互換モードのIE6 では、正しいように見えます (そのボックスに関する限り、他のすべてはガベージです)。

quirks モードを強制せずに IE6 から正しい動作を取得するにはどうすればよいですか?

* はい、これにはフロートを使用する必要があることはわかっていますが、ドキュメント全体が引き伸ばされることは気にしません。しかし、navbar の背景がページの下部に達し、タイル状にならないようにすることは明らかに神聖ですbackground-image。

<img>2 つのタグの間には改行があり、適切な書式設定のためにドキュメント内でインデントされています。

しかし、相対位置と z オーダーを使用して、ある画像 (レイアウトの一部) を別の画像の上に配置しています。

私はこのようなものを持っています

最初のタグの後の改行<img>はスペースを追加し、2 番目の<img>タグの相対的な左位置を設定すると、そのスペースが考慮され、最初の画像の少し右側に設定されます。

それらを同じ行に配置したくありません。下の画像タグを背景にすることはオプションではありません（サイズを変更する必要があります）。相対位置をいじることは問題外です（スペースを想定しています）ブラウザー/システムによってサイズが異なります)。

これを機能させることはできますか？

編集 -- 詳細

間隔が相対的な配置からずれています。それらを絶対に配置する方法はありませんが、静的な配置を持つ別の要素のleftおよびに配置する方法はありますか?top

とにかく、現在の状態のレイアウトには、別の画像に重なる画像があります。重なっている画像は div の背景で、レイアウトの一部は div 内の画像です。

リンクがクリックされたときに、重なっている画像を変更する必要があります (画像のサムネイルをクリックすると、重なった画像に大きなバージョンが表示されます)。ただし、画像はすべて異なるサイズであり、デフォルトの div 背景画像よりも大きくなっています。div の背景のサイズを変更できないため、画像にする必要があります。しかし、問題は、ある画像を別の画像に重ねることです。彼らは私が画像間でもフェードすることを望んでいるので、2 つの画像を重ねて (上部の画像が下部の画像にフェード インおよびフェード アウトする)、さらにレイアウトの端をそれらの上に重ねる必要があります。

他の方法でこれを達成する方法がわかりません

ページにホルダーdivがあり、小さな画像をランダムな位置に、それぞれに10pxのパディングがあるコラージュとしてロードします。

画像が互いに重ならないように、またはホルダーdivが重ならないようにするにはどうすればよいですか？使用できるプラグインや関数はありますか？

これまでの私のコード：

}）;

事実上、JS で行う必要があるのは、絶対に配置されたすべての要素を x ピクセル分下に移動することです。すべての要素をループして、絶対に配置されているかどうかを確認する必要がありますか? それとももっと良い方法がありますか？

ありがとう、マラ

更新: 特定: ブックマークレットを使用して任意のページに JS を挿入しているため、マークアップや実際の css ファイルを変更することはできません。このブックマークレットは、とりわけ、絶対位置にあるすべての要素を 155 ピクセル下に移動する必要があります。

このページには少し問題があります。ほとんど正しく動作しています。

赤いボックスは、ウィンドウの中央 (h&v) に配置する必要があります。動作します。

黄色のボックスは、ウィンドウの下部に貼り付ける必要があります。動作します。

ウィンドウが 400 ピクセル未満の場合、高さのスクロール バーが表示され、スクロール領域の下部に黄色のボックスが表示されます。基本的に、黄色のボックスが赤いボックスの上に表示されることは決してありません。動作しません

どうすればこれを達成できるか知っている人はいますか？

ありがとう。

フローティング バーのあるページを作成しました。問題は、スクロールバーを右側に移動すると、フローティングボトムバーが最終的には下にあるのにぎくしゃく動くことです。

背景のボディ画像を削除するか、overflow:autofor を削除して、ぎくしゃくした動きを修正しようとしましたcontainer-msg。それは機能しますが、それらをオンにする必要があります。この動きをスムーズにするにはどうしたらよいでしょうか？

HTML は次のとおりです。

ここで、単一の画像を使用して丸みを帯びた角を使用する例を見つけました。私はこれをIE7+とFireFoxで完全に機能させています。

以下は、タブレイアウトの例です。

以下は私のCSSスタイルです。

問題は、divの幅が偶数の場合、右上のdivが実際にはright：1pxとして配置されているかのように、1pxの右側の境界線になってしまうことです。幅が奇数の場合、タブの右側の灰色が表示されず、divが期待どおりに表示されます。

私が使用している画像はここにあります。完全な例はここにあります。

右上のdivがright：0pxに正しく配置されていないのはなぜですか？タブ幅が偶数の場合、IE6で1pxのギャップが発生するのはなぜですか？

私が使用したすべてのブラウザーでは、ie8 を除いて、絶対配置された要素は、相対配置で最も近い親に従って配置できます。

以下のコードは、テーブル内の 2 つの div を示しています。上部の div には position: relative がありますが、ネストされた絶対配置要素はその境界を尊重しません (ie8 では、親 div の下部ではなく、ページの下部に配置されます)。

誰かがこれの修正を知っていますか?

さて、私は何かに気づきましたが、CSS仕様でそれを見つけることができませんでした。要素をでスタイリングするposition: fixedと、ブラウザのビューポートに対して絶対に配置されます。固定位置の要素を別の要素の中に配置するとどうなりますか？

次の行に沿ったCSSの例：

私が知る限り、要素は固定位置にある最も近い親に対して固定位置にあります。これはすべてのブラウザで観察できますか。また、それはバグですか、それとも意図的な動作ですか？

これまでのところ、このトピックについては何も見つかりませんでした。「固定位置を使用すると、ページに固定されます」。