Question

小提琴：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上），我使用了边距＆amp;填充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问题（或者这里有一些好的编码器可以弄清楚我搞砸了什么），我也想让按钮的底部与文本行对齐。

有什么想法吗？

Answer 1

为什么不在您的独特案例中添加line-height:？

例如，我将line-height: 40px;添加到a.buttonlinks，并且它垂直居中。

垂直对齐链接框中的文本，否定继承的CSS属性

1 个答案: