Input text that takes 100% of the bar-footer width

What is the easiest way to make the following input take the whole footer width?
I tried some basic css rules but doesn’t work.

<div class="bar bar-footer">
      <input type="text" />   //wants width 100%
 </div>

I found the trick but still strange:

I had an included form like this:

<div class="bar bar-footer">
    <form>
      <input type="text" />   //wants width 100%
   </form>
 </div>

Changed by:

<form>
  <div class="bar bar-footer">
      <input type="text" />   
 </div>
</form>