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 回答