Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>EDIT : since bootstrap v3, classes have evolved so use col-xx-X classes to obtain the result explained below (further changes may be necessary)</p> <hr> <p><a href="http://jsfiddle.net/Sherbrow/hfexR/3/" rel="nofollow">Live demo (jsfiddle)</a></p> <p>You could use a <code>.row-fluid</code> and use <code>.spanX</code> to make the inputs fill their container :</p> <pre class="lang-html prettyprint-override"><code>&lt;form class="form-search"&gt; &lt;div class="row-fluid"&gt; &lt;input type="text" class="input-medium search-query span12"&gt; &lt;/div&gt; &lt;/form&gt; &lt;form class="form-search"&gt; &lt;div class="row-fluid"&gt; &lt;input type="text" class="input-medium search-query span8"&gt; &lt;button type="submit" class="btn span4"&gt;Cancel&lt;/button&gt; &lt;/div&gt; &lt;/form&gt; </code></pre> <p>It appears that a little fix is needed for the button/input combination :</p> <pre class="lang-css prettyprint-override"><code>/* May not be the best way, not sure if BS has a better solution */ /* Fix for combining input and button spans in a row */ .row-fluid &gt; input + button[class*="span"] { float: none; /* Remove the */ display: inline-block; /* floating */ margin-left: 0; /* Stick it to the left */ } </code></pre> <p>Last thing, you shouldn't combine <code>.spanX</code> and <code>.well</code> because of the <code>padding</code> and borders and other things, here is <a href="http://jsfiddle.net/Sherbrow/6CVns/embedded/result/" rel="nofollow">an example of why (jsfiddle)</a>.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload