CODEWITHSUNDEEP
javascriptphphtmlcssnewline
dokgu
dokgu

Reputation: 6080

New Lines Affecting Layout

I'm adding DOM elements both via PHP and Javascript. They are exactly the same elements but somehow their outputs appear differently. To get a better picture, I'm providing a very simplified code below:

Javascript

var new_div = "<div>\
    <p>Hello</p>\
    </div>";

$(new_div).appendTo("#parent");

PHP

echo "<div>
    <p>Hello</p>
    </div>";

In PHP I'm not bothering to include new lines \n because I can write multiple lines of string just by writing on the next line. In Javascript however, I needed to escape new lines by using \ or else I had to write the entire thing in one line.

When I loaded the page, both divs didn't look exactly the same. The output from Javascript looks like it has some extra margins where the newlines were supposed to be.

I can fix it by putting newlines \n on the PHP side. But I was hoping to keep the source codes cleaner and so I'm looking for a fix that only involves CSS if possible.

Thanks!

Upvotes: 1

Views: 43

Answers (1)

Nakib
Nakib

Reputation: 4713

Try doing this instead

var new_div = "<div>";
new_div += "<p>Hello</p>";
new_div += "</div>";

$(new_div).appendTo("#parent");

Upvotes: 1

Related Questions