CSS滑动门按钮中心对齐

Question

我需要帮助来对齐CSS按钮。我尝试了很多不同的变体，我无法按照自己想要的方式居中放置按钮。

首先，看看这个网址：http://www.front-end-developer.net/cssbuttons/example.htm

我使用2张图片以构成按钮（这可以在1个图像来完成，但在这种情况下，我们有两个）。只要我们将float:left或float:right应用于父div元素，一切都按预期工作，以限制div的宽度，并在div的内容结束后尽快关闭它。你可以从按钮中删除float：left来查看我的意思。

但是，中心位置的按钮呢？我无法添加浮动：左/右，因为我想在中间对齐它。

从理论上讲，我可以设置

{ 
    width:XXpx; 
    margin:0 auto; 
} 

我会得到什么，你可以在这个图片中看到：

alt text http://www.front-end-developer.net/cssbuttons/cssbuttonerror.png

但我不知道里面的文本的长度。有不同的翻译我的按钮可以很短，或5倍的长度。

我还试图用<span>代替<div>，但不幸的是嵌套内联元素不尊重他们的正确填充...

是的，我必须使用<a>里面，所以按键可以通过网络爬虫访问。

我真的被困在这一个。

Answer 1

.button {display:inline-block;} 

似乎要做的伎俩。

inline-block的浏览器的支持：http://www.quirksmode.org/css/display.html

更多关于如何解决对inline-block的相关的浏览器问题： http://foohack.com/2007/11/cross-browser-support-for-inline-block-styling/