title: CSS3 transitions chaining
body: <p>What is a syntactically clean solution to run a chain of individual CSS3 transitions on a single element, one by one? An example:</p>
  
  <ul>
  <li>set left to 10px and opacity to 1 through 200ms</li>
  <li>set left to 30px through 500ms</li>
  <li>set left to 50px and opacity to 0 through 200ms</li>
  </ul>
  
  <p>Can this be done without JavaScript? If not, how to code it cleanly with JavaScript? </p>