0

とてもシンプルなボタンがあります。SafariまたはChromeで表示すると、テキストは正方形を垂直方向に中央に配置して表示されます。しかし、Firefoxでは、テキストは垂直方向の中央に配置されていません(見下ろしています)。これを解決するにはどうすればよいですか?

http://jsfiddle.net/yyL5T/5/

HTML:

<div class="buy">mmmmm</div>

CSS:

body {
  font-family:Tahoma;
  color:#fff; 
  font-size:11px; 
  letter-spacing:1px;
}

.buy {
  position:absolute;
  width: 70px;
  height: 20px;
  line-height:20px;
  top:50px;
  left:50px;
  text-align:center;
  background-color:#bbb;
}
4

2 に答える 2

0
.comprar {
    position:absolute;
    top:50px;
    left:50px;
    text-align:center;
    background-color:#bbb;
    padding: 5px 10px;
}
于 2012-05-17T15:06:09.927 に答える
0

divがあまり高くない場合、Firefoxではテキストを中央に配置するのに問題があるようです。(どうしてか分かりません)。この特定のケースでは:font-family:Tahoma; フォントサイズ:11px; divの中央に配置するには、divを23px以上にする必要があります。

.buy {
  position:absolute;
  width: 70px;
  height: 25px; /* this is what changes */
  line-height:25px; /* this is what changes */
  top:50px;
  left:50px;
  text-align:center;
  background-color:#bbb;
}

ここで再生:http://jsfiddle.net/yyL5T/8/

于 2012-05-20T09:26:59.090 に答える