css - simple form and input width error in bootstrap -
i've created extremely simple form contains 2 inputs , 2 buttons. when form take 6 spans width , centered.
below code:
<div class="container-fluid padded"> <div class="row"> <div class="container"> <div class="row"> <!--filtry--> <div class="span6 offset3 padded" style="border: 1px solid black;"> <form action="#" method="get" class="form-horizontal"> <fieldset> <div class="control-group"> <label class="control-label">data od</label> <div class="controls"> <input type="text" id="dataod" class="input-xlarge" /> </div> </div> <div class="control-group"> <label class="control-label">data do</label> <div class="controls"> <input type="text" id="datado" class="input-xlarge" /> </div> </div> <div class="form-actions"> <div class="pull-right"> <a class="btn wczytaj" href="#"><i class="icon-play icon-white"></i>wczytaj</a> <a class="btn btn-info disabled eksportuj" href="#" id="eksportuj"><i class="icon-download-alt icon-white"></i>eksportuj</a> </div> </div> </fieldset> </form> </div> </div> </div> </div> </div>
my form in full size browser looks this:
but after resizing result:
how should change code input 100% width on every resolution? there simple way or must tweak whole bootstrap?
i've tried adding span* classes inputs without luck. there similar questions on (https://stackoverflow.com/a/11193864/965722), answer involves javascript , avoid that.
here jsfiddle code: http://jsfiddle.net/misiu/hdsen/
you need increase width of span. set span8 instead of span6.
demo : jsfiddle.net/hdsen/3
or
if want display full width of box on page, add span12 instead of span6
jsfiddle.net/hdsen/5/
updated
<div class="span7 offset3 padded well">
the problem is, form greater span7. form width> span7,6,5,4.... need set width input box.
Comments
Post a Comment