CODEWITHSUNDEEP
htmlcss
jagershark
jagershark

Reputation: 1241

Remove non breaking space from <h4>

A non-breaking space is appearing inside a <h4> tag, just before the text content:

Screenshot of rendered HTML <h4> tag with non-breaking space

In my html, there is a space between the tag and the first word, but should this not just collapse?

Here is my code:

<h4> Sed do eiusmod tempor incididut </h4>

When inspecting the element in Chrome dev tools, the non-breaking space entity shows:

Screenshot of code in Chrome dev tools

I have not applied any whitespace css rule to this element. I have never seen this before. It behaves as though the <h4> tag is wrapped in a <pre> tag...

Upvotes: 0

Views: 676

Answers (1)

user663031
user663031

Reputation:

The only problem that fits these symptoms is that you have a non-breaking space in your source file, which is visually indistinguishable from a regular space. How it might have gotten there is anybody's guess. Perhaps you accidentally hit some key combination that inserted a non-breaking space.

If your editor allows you to examine the code point, then do so (a non-breaking space would be U+00A0). Otherwise, select that little critter and delete it and replace it with a real space.

There is no way, all else being equal, that a space at the beginning of an h4 tag would magically not be subject to standard HTML white space collapsing. People can and should be able to put spaces in places like that, or even put the text on a separate line. It improves readability.

This problem could in theory also be caused by various CSS settings, including margins, text-indent, :before rules, white-space settings, and so on. However, none of these would cause the DOM to indicate a non-breaking space is present. The only conceivable alternative is some client-side script that modifies the element content.

Upvotes: 3

Related Questions