レスポンステキストボックスjQueryモバイル

Question

jQueryモバイルにラベルとテキストボックスがあり、画面サイズが変更されたときにも構造全体が変更されます。

私は画面サイズの幅が448px以下になると、ラベルの下のテキストボックスに移動しますが、447pxを超えると、隣り合うものの横になります。

私はクリアするために2枚の写真を追加しています。

これはコードである：

HTML：

<div role="main" class="ui-content"> 
     <form> 
      <div class="ui-field-contain"> 
       <label for="sales1">Sales:</label> 
       <input type="text" id="sales" value=""> 
      </div> 
</form> 
</div> 

のCss：

.ui-field-contain .ui-input-text { 
    width: 50% !important; 
} 

それをオーバーライドし、いつもどんなスクリーンサイズでも他のものの隣にあるようにするCSSの方法はありますか？

Answer 1

あなたはちょうど私がHTMLで `` `.ui-入力text```が表示されない

@media (max-width: 448px) { 
    .ui-field-contain label { 
    display: block; 
    } 
}