class sang phải một yếu tố trong jquery mobile

Question

tôi đã tạo ra các yếu tố hình thức này:

<div class = "ui-grid-a"> 
       <div class= "ui-block-a"> 
        <div data-role="fieldcontain" class = "ui-hide-label"> 
         <label for="birth-place">Birth Place</label> 
         <input type="text" name="birth-place" id="birth_place" value="" placeholder="Birth Place" /> 
        </div> 
       </div> 
       <div class = "ui-block-b"> 
        <div data-role = "fieldcontain" class="ui-hide-label"> 
         <label for="province">Province</label> 
         <input type="text" name="province" id="province" value="" placeholder="PR" /> 
        </div> 
       </div> 
      </div> 

và tôi muốn sắp xếp các yếu tố province bên phải. Làm thế nào tôi có thể làm điều đó?

Answer 1

Hãy thử điều này: <span style="float:right"><label for="province">Province</label></span> (tất nhiên bạn có thể đặt điều này cũng trong một file css bên ngoài)

Answer 2

Chỉ cần thực hiện như sau ... Apply này CSS tùy chỉnh để mã của bạn ...

label[for="province"] { text-align:right; } 

Nếu nó không chạy mà họ cung cấp nhãn với một tên lớp và làm như sau ..

label.className { text-align:right; } 

Answer 3

Appl y một kiểu text-align: right; đối với trường input trực tiếp, như trong fiddle này.

http://jsfiddle.net/den232/Fw2yA/

Chúc may mắn!

.floatright { 
    text-align:right; 
} 
    <div data-role="page" class="type-home"> 
<div data-role="content"> 

<div class = "ui-grid-a"> 
<div class= "ui-block-a"> 
<div data-role="fieldcontain" class = "ui-hide-label"> 
<label for="birth-place">Birth Place</label> 
<input type="text" name="birth-place" id="birth_place" value="" placeholder="Birth Place" class='floatright' /> 
</div> 
</div> 
<div class = "ui-block-b"> 
<div data-role = "fieldcontain" class="ui-hide-label"> 
<label for="province">Province</label> 
<input type="text" name="province" id="province" value="" placeholder="PR" /> 
</div> 
</div> 
</div> 



</div> 
</div>