68

  is a non breaking space, which represents an empty space where no line break occurs.

If I use

<p>&nbsp;</p>

I have a space between two passages (bigger break). If I use

<p> </p>

I only have a new line between the two passage (no break). Why?

2
  • 3
    Part of the problem is that you want to create an empty paragraph element between paragraphs, while the correct way to get a spacing between them is to use CSS. Sep 5, 2012 at 10:50
  • Or <br /> but since the code is generated from a WYSISWG editor I don't have so much influence on it.
    – grabner
    Sep 5, 2012 at 10:56

3 Answers 3

72

In HTML, elements containing nothing but normal whitespace characters are considered empty. A paragraph that contains just a normal space character will have zero height. A non-breaking space is a special kind of whitespace character that isn't considered to be insignificant, so it can be used as content for a non-empty paragraph.

Even if you consider CSS margins on paragraphs, since an "empty" paragraph has zero height, its vertical margins will collapse. This causes it to have no height and no margins, making it appear as if it were never there at all.

3
  • Empty means that this element will not be represented?
    – grabner
    Sep 5, 2012 at 10:44
  • 4
    it will be represented, but it will not ocuppy space, since it has 0 height. Sep 5, 2012 at 10:53
  • @Nik-Lz it's still present in the DOM, which is what I take "represented" to mean.
    – dev_willis
    Jan 31, 2019 at 4:29
7

How about a workaround? In my case I took the value of the textarea in a jQuery variable, and changed all "<p>&nbsp" to <p class="clear"> and clear class to have certain height and margin, as the following example:

jQuery

tinyMCE.triggerSave();
var val = $('textarea').val();
val = val.replace(/<p>&nbsp/g, '<p class="clear">');

the val is then saved to the database with the new val.

CSS

p.clear{height: 2px; margin-bottom: 3px;}

You can adjust the height & margin as you wish. And since 'p' is a display: block element. it should give you the expected output.

Hope that helps!

3

If I understand your issue this should work

&emsp—the em space; this should be a very wide space, typically as much as four real spaces. &ensp—the en space; this should be a somewhat wide space, roughly two regular spaces. &thinsp—this will be a narrow space, even more narrow than a regular space.

Sources: http://hea-www.harvard.edu/~fine/Tech/html-sentences.html

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.