Jquery Mobile-页脚元素，100％宽度

我试图添加一个文本输入和按钮并排到页脚，它工作正常，但我需要它的宽度是100％，即流体布局。任何帮助不胜感激。Jquery Mobile-页脚元素，100％宽度

<form method="post" action="send.php"> 
     <div style="float:left;"> 
      <input style="" data-mini="true" type="text" name="message" id="message" value="" data-theme="a"/> 
     </div> 

     <div style="float:left;"> 
     <input type="submit" id="submit" value="Send Message" data-mini="true" data-theme="a"/> 
     </div> 
</form>

来源

2012-07-27 Guernica

只需附上网格内的表单元素自动伸展，像这样的投入：

提供我自己的直列宽度的输入舒展他们我想要的方式。您也可以创建自己的班级，并将其与.ui-block-*班级结合使用。

<form method="post" action="send.php" class="ui-grid-a"> 
    <div style="width:80%;" class="ui-block-a"><input style="" data-mini="true" type="text" name="message" id="message" value="" data-theme="a"/></div> 
    <div style="width:20%;" class="ui-block-b"><input type="submit" id="submit" value="Send Message" data-mini="true" data-theme="a"/></div>  
</form>

演示：http://jsfiddle.net/tKcMg/1/

来源

2012-07-27 12:06:01

这是我的第一个想法，但我想输入跨越像80％和按钮20％。 – Guernica 2012-07-27 12:09:26

@jacksonpollocks你可以修改内联网格的宽度，或者只是用所需的宽度创建你的类。试试这个：http://jsfiddle.net/tKcMg/1/ – 2012-07-27 12:15:00

不错的，我不知道为什么我从来没有想到这一点。我真的需要停止有早餐关节：D谢谢... – Guernica 2012-07-27 12:26:20

<div id="resize"> 
    <input id="text" type="text" style="float:left;"/> 
    <input id="submit" type="submit" value="submit" style="float:left;" /> 
</div> 

$(function() { 
    resize_input(); 

    $(window).resize(function(){ 
     resize_input(); 
    }) 
}); 
function resize_input(){ 
    var foo = $('div#resize').outerWidth(); 
    var bar = $('input#submit').outerWidth(); 
    $('input#text').outerWidth(foo - bar); 
}

来源

2012-07-27 12:24:01 Kir

Jquery Mobile-页脚元素，100％宽度

回答

相关问题