0

フィドル: http: //jsfiddle.net/jgallaway81/ax9wh/

<a href="lcars.jfx.php" class="leftbuttons buttonlinks antibutton">
  LCARS Locomotive O.S.
</a>

私の問題は、グラフィックのテキストラベルです。私はこのボタンのデザインをサイト全体で使用しており、テキストとそのサイズのみが異なります。私が最初にシステムを設計したとき(ページ:http ://www.fccorp.us/development/index.php 、次にhttp://www.fccorp.us/development/index.fccorp.php)、余白とパディングCSSコントロールを使用して、テキストをボタン内の垂直方向の中央に配置します。staticしかし、それはフォントの高さに依存していました。今、私はより高いフォントを使用したいのですが、高さを自動中央揃えにすることができません。私は試した

.leftbuttons {
  width:335px;
  height:40px;
  padding:**auto**
  20px **auto**
  45px; font-size:1em;
  border-style:solid;
  border-width:0px;
  font-family:Arial;
  font-weight:900;
  margin-left:10px;
  margin-right:20px;
  margin-top:20px;
  margin-bottom:20px;
  text-align:center;
  display:inline-block;
  background-image: url(http://img580.imageshack.us/img580/1461/lcarssitebutton.png);

}

しかし、結局のところ、画像を切り刻むだけでした。

を使用して、.antibutton取得しようとしているものを取得するために、他のクラスのいくつかの詳細をオーバーライドしようとしています。テキストのvertical-align問題を解決できる場合(または、ここにある優れたコーダーが、私が何を台無しにしたかを理解できる場合)、ボタンの下部をテキスト行と揃えたいと思います。

何かご意見は?

4

1 に答える 1

1

line-height:ユニークなケースにを 追加してみませんか?

たとえば、に追加line-height: 40px;するa.buttonlinksと、垂直方向にうまく中央に配置されます。

于 2013-03-26T00:06:52.177 に答える