0

私のページには、次のように固定幅の大きな div が 1 つあります。

#index_body{
  width: 1010px;
  background-image: url('images/main_bg_dark.png'); 
  margin: auto;
  overflow: hidden;
  min-height: 50px;
  padding-bottom: 10px;
  border-radius: 7px;
  -moz-box-shadow: 0 5px 15px #000000;
  -webkit-box-shadow: 0 5px 15px #000000;
  box-shadow: 0 5px 15px #000000;
}

ページの右側 (垂直方向の中央) にボタン (20x20px) を追加したい - まだ index_body の隣にある。

したがって、ボタンには次のようなコードがあります。

#butt {
  width:20px;
  height:20px;
  background: url('images/scrollUp.png');
  position:fixed;
  top:50%;
  left:WHAT SHOULD BE HERE??
}

実際の解像度に依存するためです。私の index_body は常に中央にあります。解像度を変更すると、ボタンが左右に移動します...

4

3 に答える 3

1

leftまたはの位置を設定する代わりにright、ボタン要素がインデックス要素の内側にあることを確認してから、マージンを使用します。

margin: 0px 0px 0px 1010px;

これがあなたのコードでテストされ動作しているバージョンです-http://lukewakeford.co.uk/testsite/blackbutton/

于 2012-10-27T20:03:13.393 に答える
0

わかりました、次のようになります。

#butt {
  width:20px;
  height:20px;
  background: url('images/scrollUp.png');
  position:fixed;
  top:50%;
  margin-left: 1010px;
}
于 2012-10-27T19:46:20.320 に答える
0 
#butt {
  width:20px;
  height:20px;
  background: url('images/scrollUp.png');
  position:fixed;
  top:50%;

  right: 10%;
}

10% は例です。見栄えの良いパーセンテージに変更し、画面の解像度に対応する必要があります。

一方、固定要素を固定コンテナー内に配置する必要があるのはなぜでしょうか? 絶対にして、右に余白を付けてフロートするだけです。

于 2012-10-27T18:58:49.543 に答える