0

私はjqueryモバイルを使用しており、送信ボタンのあるフォームを持っています。残念ながら、いくつかの調査を行った後、jquery mobile の data-inline 属性が入力要素に対して機能しないことがわかりました。送信ボタンをテキストのサイズに合わせたいです。ボタンは私が望むサイズであるため、Firefoxはこれを処理する必要があります。ただし、IE はボタンの幅をコンテナーのサイズに設定します。送信ボタンをそのテキストのサイズに合わせてそれ以上にスタイルする方法はありますか? 私はやってみました：

$('#element').css('display','inline')

しかし、それはうまくいきませんでした。

助けてくれてありがとう！

4

2 に答える 2

1

<input type="button" />これは、属性を追加すると正しく「インライン」になる要素のデモですdata-inline="true"(これは IE8/IE9 でテストされています): http://jsfiddle.net/eVTef/

IE7 でこれを修正するには、「インライン ハック」を追加する必要があります。

.ui-btn-inline {
    *display : inline !important;
    zoom     : 1;
}

アスタリスク ( *) で始まるプロパティは、IE8/IE9 またはその他の最新のブラウザーでは読み取られませんが、IE7 では読み取られます。zoom : 1要素が CSS を取得するように、をhasLayout追加する必要があります (手動で要素に追加することはできません)。

上記の修正のデモは次のとおりです: http://jsfiddle.net/eVTef/1/

ボーナスラウンド

この問題は IE6 でも修正できますが、要素の高さを指定する必要があります。IE6 のみの高さを指定し、他のブラウザーを指定しないようにするには、IE7 のアスタリスク ハックと同様のことを行うことができます。

.ui-btn-inline {
    *display : inline !important;
    zoom     : 1;
    _height  : 30px;
}

IE7 でさえ、アンダースコア ( _) で始まるプロパティを無視しますが、IE6 ではプロパティ宣言を使用します。

于 2012-06-05T15:59:15.123 に答える
0

テキストを<span>タグで囲み、その幅を計算します。

例を参照してください: http://jsbin.com/oxocil/2/edit

編集: javascript を介して span タグを追加し、必要に応じて同じ方法で削除することもできます。

于 2012-06-05T15:56:30.267 に答える