View Full Version : Resolved Content editable div reduce line spacing

02-08-2012, 09:09 AM
Hello everyone,

This is my code

<BODY STYLE="overflow:hidden; margin:0px; background-color:grey;">
<DIV ID="oDiv" CONTENTEDITABLE STYLE="height:60%; background-color:white; overflow:auto; width:30%; line-height:10%;">

Is there any way to remove the giant spacing between each line in the div?
I've tried css line-height.

02-08-2012, 01:59 PM
Firefox 'gets it right' IE inserts a p for each line break from the enter key, Firefox a br tag. You can use style in the head of the page to 'fix' IE, or just don't hit the enter key unless you want a new paragraph.

The 'fix':

<style type="text/css">
#oDiv p {
margin: 0;

Full demo:

<!DOCTYPE html>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
html, body {
height: 100%;
body {
overflow: hidden;
margin: 0px;
background-color: gray;
#oDiv {
height: 60%;
background-color: white;
overflow: auto;
width: 30%;
#oDiv p {
margin: 0;
<div id="oDiv" contenteditable></div>

02-08-2012, 09:27 PM
Thanks jschuer1