title: CSS text hiding behind DIV in some cases
body: <p>Have a look at <a href="http://jsfiddle.net/hg25u/" rel="nofollow">http://jsfiddle.net/hg25u/</a></p>
  
  <p>I have made the HTML text on the right editable, so if you click inside the <code>Result</code> block (bottom right) you can actually change it by typing. Now if you place your typing cursor above the text:</p>
  
  <p><code>Bonorum has. His ut cibo quas tantas,</code> </p>
  
  <p>and hit <code>Enter</code> on your keyboard, you will see that the text hides behind the grey DIV tag just below it, it shouldn't do that and I figured its a CSS problem but I cant get it to work. Its supposed to appear BELOW the grey DIV tag not hide behind it like its doing. If you mess around you will see it does that in a lot of instances when you hit Enter, sometimes it behaves properly sometimes it doesn't. </p>
  
  <p>It should not hide text behind those grey DIV bars at any given moment. When you hit Enter it's supposed to continue the text line BELOW the grey DIV tag.</p>
  
  <p>Any help would be appreciated</p>
  
  <p>Also please have a look at this image to understand it better <a href="http://bayimg.com/eaIImAaef" rel="nofollow">http://bayimg.com/eaIImAaef</a></p>