CODEWITHSUNDEEP
javascripthtmlcssnode.jshandlebars.js
Borislav Borisov
Borislav Borisov

Reputation: 408

Node handlebars adds extra text node before rendered view

I have the following issue: When rendering a view in a layout with handlebars, the engine adds an extra text node before the rendered view body

<nav></nav>
{{{body}}}
<footer></footer>

results in

<nav></nav>
"
[empty text node here]
                      "
<rendered view>
<footer></footer>

That empty text node has its own height and breaks my CSS margins and paddings. Note that if I put the view HTML directly in the layout without using handlebars templating, there is no text node and everything is fine.

Any ideas why is this happening and how to solve it?

Upvotes: 3

Views: 810

Answers (2)

Bogac
Bogac

Reputation: 3707

@leoyoo answer is the right one. I was about to post same question and found this.

On Chrome, source shows that white space character as seen below (red dot): enter image description here

...and stringifies to &#65279;

I'm on Visual Studio and this is the default setting when files are saved: enter image description here

When I change it to UTF-8 without signature (as seen below) that whitespace character dissapears.

enter image description here

On Visual Studio you do: File>>Save fileName.ext As and then drop-down next to Save button. enter image description here

Upvotes: 3

leoyoo
leoyoo

Reputation: 46

I think I found the reason, please check your partial view file, whether there is BOM inserted in file, some editors will insert this in file with UTF-8, UTF-16 and UTF-32 format. so if you are using UTF-8, just remove the BOM will be good.

Upvotes: 2

Related Questions