title: Setting max size of contenteditable element
body: <p>I wonder if I could set the max size of contenteditable element, preventing it from typing more characters than the editable "window" width is.</p>
  
  <p>I have something like this:
  <code>&lt;h2 contenteditable="true"&gt;My text&lt;/h2&gt;</code></p>
  
  <p>The <code>h2</code> element has it's own size and style:</p>
  
  <pre><code>h2 {
  display: inline-block;
  overflow: hidden;
  width: 300px;
  max-width: 300px;
  height: 15px;
  max-height: 15px;
  }
  </code></pre>
  
  <p>Now, when I reach the max size, I can type more characters and it looks like I jump into next line. When I hit <strong><em>enter</em></strong> button i also jump down into next line/raw. </p>
  
  <p>What I want to reach is to block this editable content "window" when I reach their max width and block the possibility to increase the height by hitting <strong><em>enter</em></strong> button.</p>
  
  <p>I want to know if it is possible to do it using html5/css or only chance is to create some javascript code?</p>
  
  <p>Thanks in advance for you help!</p>