按钮文本出现在按钮之外

Question

我在这里有一个非常奇怪的问题，有一个HTML按钮。用于按钮内部的文本也出现在按钮外部。我正在标题中调用jQuery和jQuery Mobile，并在页面上显示自定义样式表。

这是我用于按钮的CSS。

button {
color:#000;
font-size:18px;
min-width:150px;
padding:10px;
text-align:center;
text-shadow:1px 1px #FFF;
width:150px;

border-radius: 10px;
-moz-border-radius:10px;
-webkit-border-radius: 10px;
}

这是我正在使用的按钮的代码。

<button  onclick="try{ login(); }catch(e){ alert(e); }">Log In</button>

以下是输出的实际情况。

这完全是我的想法。关于如何防止文本出现在按钮外的任何建议？

的jsfiddle http://jsfiddle.net/u7DH2/

Answer 1

这与jquery-mobile存在一些冲突......如果你发表评论它可以解决问题。

<!--<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js" type="text/javascript"></script> -->

在这里查看... jsfiddle.net/u7DH2/2