3

次のコードで作成された「キャンセル」ボタンを含む単純なログインフォームがあります。

var cancelButton = document.createElement("input"); 
cancelButton.setAttribute('type',"button");
cancelButton.setAttribute('value',"Cancel");
cancelButton.setAttribute("id", "user-cancel-button");

ボタンのcssは次のとおりです。

#user-cancel-button{
  left: 3px;
  top:3px;
  text-align: center;   
  position: absolute;

}

すべてのデスクトップ ブラウザでは問題なく表示されますが、モバイル サファリでは「キャンセル」テキストは常に右揃えになります (text-align: left を設定しても)。

一方、ボタンにパディングを追加すると (パディング: 1 ピクセル)、モバイル サファリでレンダリングされます。誰が何が起こっているのか説明できますか?

4

1 に答える 1

0

try doing this:

<button id="user-cancel-button"><div align="center">cancel</div><button>

This should solve the problem with the mobile safari.

于 2014-07-06T03:27:35.617 に答える