2012-04-28 3 views
0

jQuery 모바일을 사용하여 사이트를 만들었으며 어떤 이유로 인해 동일한 줄에 텍스트 상자와 버튼을 둘 수 없었습니다. 그리드를 사용Jquery 모바일 스타일링 문제

<div data-role="footer" data-position="fixed"> 
      <input type="text" placeholder="Your Message" id="usermsg" /><input type="button" value="Send!" id="submitmsg" /> 
</div> 
+0

버튼의 공간을 만들기 위해 텍스트 상자의 크기를 조정하려했지만 작동하지 않았습니다. –

+0

신경 쓰지 마세요. 나는 그것을 알아. –

답변

0

이 작업을 수행하려면 올바른 방법입니다.

<label for="points">Textbox and a Button on the same line.</label> 
    <div data-role="footer" data-position="fixed"> 
    <div class="ui-grid-a"> 
     <div class="ui-block-a"> 
      <input type="text" data-inline="true" placeholder="Your Message" id="usermsg" /> 
     </div> 
    <div class="ui-block-b"> 
      <input type="button" value="Send!" id="submitmsg" data-inline="true"/> 
    </div> 
    </div> 

그리드 크기를 변경하려면 간단히 CSS를 추가하면됩니다. 예. class="ui-block-a myField" 또한 빠른 제안으로 AJAX 탐색으로 인해 JQuery Mobile에서 ID를 사용하지 않도록 권유했습니다. 대신 클래스를 사용하는 것이 좋습니다.