title: JQuery Mobile set width of 2 elements to 80% and 20%
body: <p>I am using JQuery Mobile and am trying to set the width of two elements using <code>ui-grid-a</code> as shown in the code below. The result is 2 elements whose width is equal to <code>50:50%</code>.  I would like my input text width to be <code>80%</code> and my button to be <code>20%</code> in same line. How can do this?</p>
  
  <pre><code>&lt;div data-role="footer" data-theme="a" class="ui-grid-a"  data-position="fixed"&gt;
      &lt;div class="ui-block-a" &gt;
          &lt;input id="outgoingMsg" placeholder="Your Message . . ."&gt;
      &lt;/div&gt;
      &lt;div class="ui-block-b" &gt;
          &lt;div style="margin: 10px 0 0 0;"&gt;
              &lt;a id="callDialog" href="#dialog" type="button" 
                   data-theme="b" data-rel="dialog"  
                   data-transition="slidedown"&gt;Send&lt;/a&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>