HTML CSS 按钮文本对齐不起作用

Question

我有这样的代码:

 <button class="prikazi_pretragu">Napredna Pretraga</button>​

和 CSS:

button {
  display:inline;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; 
  float: right; 
  clear: both; 
  padding: 0 50px 5px 5px; 
  text-align: left; 
  margin: 0 0 10px 0; 
  border: none; 
  background: url('../img/resursi/advsearch_plus.png') no-repeat 0 -28px rgba(0,0,0,.09);
  font-size: 14px; 
  height: 28px;
  text-align: right
}​

text-align 无效。有什么问题？

http://jsfiddle.net/KjGBW/1/

Answer 1

它正在工作。它向右对齐(毫无意义，因为您没有明确设置宽度)。只是右侧有 50 像素的填充，这就是为什么它似乎与左侧对齐。

padding: 0 50px 5px 5px;

值按右上角左下角的顺序排列。

设置为padding: 0 5px 5px 5px;

此外，如果您将宽度设置为 300 像素，您会看到它清楚地向右对齐。

参见 http://jsfiddle.net/thebabydino/KjGBW/5/ - 我改变了填充并增加了宽度。现在你可以清楚地看到它是右对齐的。