title: Placeholder for contenteditable div
body: <p>I have the following: <a href="http://jsfiddle.net/RZZ6X/">FIDDLE</a></p>
  
  <p>The placeholder works fine and dandy until you type something, <kbd>ctrl</kbd> + <kbd>A</kbd>, and <kbd>delete</kbd>. If you do that, the placeholder disappears and never shows up again.</p>
  
  <p>What's wrong? How can I have a placeholder for a contenteditable div?</p>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;div class="test" placeholder="Type something..." contenteditable="true"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><hr/>
  <strong>CSS:</strong></p>
  
  <pre><code>.test {
      width: 500px;
      height: 70px;
      background: #f5f5f5;
      border: 1px solid #ddd;
      padding: 5px;
  }
  
  .test[placeholder]:empty:before {
      content: attr(placeholder);
      color: #555; 
  }
  </code></pre>
  
  <p><hr/>
  Thanks.</p>