6

ポジショニング、最大幅、および 'right: 0px' をうまく連携させることができません! サイトの右上隅に固定されている div を作成しています。ページのコンテンツの最大幅は 1000 ピクセルですが、ラベルは「右: 0 ピクセル」という私のルールに従っているだけで、最大幅に達すると違反して右側に固定されます。また、デフォルトでは、div は左上にあり、最大幅に従います (ただし、「left: 0px;」と入力すると、ルールに従わず、左にくっつきます)。

CSS:

#content {
margin: 0 auto;
max-width: 1000px; }

#div {
width: 150px;
position: fixed;
right: 0px; }

私がすでに試したいくつかの代替手段は次のとおりです。

  • width: 100% (with text-align: right) <--- あまり正しくなく、150px ではなく 100% の幅は好きではありません
  • html（CSSではなく）に「手動で」divを配置するコードを追加する
  • float と text-align が固定位置に影響しないことを発見しました

助けていただければ幸いです。ありがとうございました。

4

5 に答える 5

14

私の理解が正しければ、これがあなたの求めているものです。

コンテンツを右に移動するには、絶対位置を持つコンテナを追加してから、固定位置コンテナを使用して、必要な場所でコンテンツを右上に保持する必要があります。

于 2012-07-13T09:57:33.723 に答える
0

position：fixedは、どのコンテナに対しても相対的ではありません。これは、DOMのhtml要素に関連しています。これが、＃contentに対して何をするにしても極右で表示される理由です。

于 2012-07-13T09:12:34.883 に答える
0

jsfiddleで問題なく動作しました。その領域に影響を与えている CSS を調べてみるとよいでしょう。#content がブロック レベルの要素でない場合 (幅が適用されないなど)、問題が発生する可能性があります。より多くのコードを提供していただけると、何が起こっているかを正確に把握し、より多くのことを支援できます。

于 2012-07-13T09:03:56.167 に答える
0

これが必要だと思います：

#content {
  margin: 0 auto;
  max-width: 1000px; 
  height:20px;
  background:yellow;
  position: relative;
}
#div {
  width: 150px;
  position: absolute;
  right: 0px;
}
于 2012-07-13T09:07:19.510 に答える