2

私は100％幅のメニューを作成しています。そして、左側に1つ、右側に1つのボタンを配置しようとしています。

これは私が持っているものですが、ご覧のとおり、ボタンは右から8px配置されていません。

どうすればいいですか？ありがとう！

#options-buttons {
    height: 40px;
    width: 100%;
}

.okay_button
{
  position: relative;
  top: 3px;
  right: 8px;
  background-image:url('http://i.imgur.com/RIIV8.png');
  float: left;
  display: block;
  width: 68px;
  height: 34px;
  background-repeat: no-repeat;
  outline: none;
}

.okay_button:hover
{
  background-position: 0 -34px;
}
4

3 に答える 3

5

右と右にフロートを使用します。 jsFiddle

.okay_button
{ 
  top: 3px;
  right: 8px;
  background-image:url('http://i.imgur.com/RIIV8.png');
  float: right;
  display: block;
  width: 68px;
  height: 34px;
  background-repeat: no-repeat;
  outline: none;
}
于 2012-10-06T18:37:43.183 に答える
1

実例（デモ用に背景をテキストに置き換えました）：

フロート、ディスプレイ、および位置が正しく混合されていません。

于 2012-10-06T18:41:42.413 に答える
1

position: relative;に変更するだけposition: absolute;で.okay_button、通常の位置ではなく、コンテナに対して相対的な位置になります。

実例： http： //jsfiddle.net/zPkH8/3/

.okay_button
{
  position: absolute;

  ...

}
于 2012-10-06T18:44:28.493 に答える