title: HTML/CSS Spacer (like Flex's)
body: <p>I've been wondering if there is any technique to use HTML/CSS like Flex/MXML. I mean, in MXML the HBox, VBox and Spacer are globally used, and their behavior is predictable. But in HTML/CSS we use a lot of float and it always have some 'hidden surprises'.</p>
  
  <p>With Flex/MXML I would do:</p>
  
  <pre><code>&lt;hbox width="100%"&gt;
      &lt;button label="Button A" /&gt;
      &lt;spacer width="100%" /&gt;
      &lt;button label="Button B" /&gt;
      &lt;button label="Button C" /&gt;
  &lt;/hbox&gt;
  </code></pre>
  
  <ul>
  <li>If you don't know flex I explain this code: the HBox places every element inside it side by side, and the Spacer is an invisible element; the spacer with 100% does not have the same width as the parent (HBox) but it fills the remaining space; this means that A will be aligned to the left, and the two other to the right.</li>
  </ul>
  
  <p>Now in HTML/CSS I would make buttons B and C float to the right. I also would have to reverse the order of the buttons to the final result be the same. Besides, I probably would put some blank tag with "clear:both" to ensure that nothing below will be messed up.</p>
  
  <p>So, is there any technique to obtain the same functionality in HTML/CSS? That would be fantastic if we could make .HBox .VBox .Spacer CSS classes and without javascript.</p>
  
  <p>thanks in advance.</p>