title: Easy way to change visual order of input fields dynamically (without changing form HTML)?
body: <p>I have a certain form that is made as angular directive template. It contains several INPUT fields in certain order. I can not construct that form dynamically using ng-repeat approach, because some fields have custom behaviour, special validators and such. </p>
  
  <pre><code> &lt;div ID="1"&gt; input field 1&lt;/div&gt;
   ...
   &lt;div ID="7"&gt; input field 7&lt;/div&gt;
  </code></pre>
  
  <p>I however have a need to display these input in different random order under some use case. The logic and contents of form remains the same but just one input that used to be 7th should become 1st. It would be great if I can achieve it using a CSS class that is conditionally applied to certain elements (likely, using ng-class option).</p>
  
  <p>What CSS I can possibly use to keep the same template (sketched above) but have visually "div id=7" to appear before "div id=1" ?</p>
  
  <p>I prefer to avoid DOM manipulating and have it angular-friendly way.</p>