2012-04-28 97 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

我已经尝试调整文本框的大小来为按钮腾出空间,但那不起作用。 – 2012-04-28 14:41:24

+0

没关系。我想到了。 – 2012-04-28 14:57:38

回答

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" 也作为一个快速的建议,我会推荐远离在JQuery Mobile中使用ID,因为AJAX导航。建议使用类来代替。