title: How to animate elements move with css3 transitions after hiding some element
body: <p>Is it possible to animate elements move with css3 transitions after hiding some element using jQuery's <code>.fadeOut()</code>?</p>
  
  <p>I found some kind of solution <a href="http://blog.stevensanderson.com/2013/03/15/animating-lists-with-css-3-transitions/" rel="noreferrer">here</a> (see "It works for grids, too" section):</p>
  
  <p>However my case is more like this:
  <a href="http://jsfiddle.net/CUzNx/5/" rel="noreferrer">http://jsfiddle.net/CUzNx/5/</a></p>
  
  <pre><code>&lt;div class="container"&gt;
      &lt;div id="item1" class="item"&gt;Test1&lt;/div&gt;
      &lt;div id="item2" class="item"&gt;Test2&lt;/div&gt;
      &lt;div id="item3" class="item"&gt;Test3&lt;/div&gt;
      &lt;div id="item4" class="item"&gt;Test4&lt;/div&gt;
      &lt;div id="item5" class="item"&gt;Test5&lt;/div&gt;
      &lt;div id="item6" class="item"&gt;Test6&lt;/div&gt;
      &lt;div id="item7" class="item"&gt;Test7&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div style="clear:both"&gt;
  &lt;button onclick="$('#item1').fadeOut();"&gt;
     Hide first
  &lt;/button&gt;
  &lt;button onclick="$('#item1').fadeIn();"&gt;
     Show first
  &lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I have floating div elements and after some element is hidden, it would be nice if other elements were animated. Is it possible?</p>