How to add whitespace between two elements in razor (Blazor) file?-CodePudding

I'm trying to add space between two strings in razor file in Blazor project.

What I'm trying to achieve is to get string like $"{name}, {date}".

Its complicated because I want to set different style for {name} and {date}. So in razor file, I have something like

<span >@(name)</span>, <span >@(date)</span>

Unfortunately space between </span>, and <span> is ignored. I also tried the following:

<span >@(name), </span><span >@(date)</span>
<span >@(name)</span><text>, </text><span >@(date)</span>

Every time I get "name,date" instead of "name, date"

I know I can achieve it by

@($"<span class=\"c1\">{name}</span>, <span class=\"c2\">{date}</span>")
//or
<span >@(name)@(", ")</span><span >@(date)</span>
//or
<span >@($"{name}, ")</span><span >@(date)</span>
//or maybe
<span >@name</span><span >@(date)</span>

But is there any "clean" or preferred way just to not ignore the space key in such situations?

CodePudding user response：

You can try adding   But generally speaking what you displayed should work. Maybe your CSS Stylesheet is messing with the spacing.

You can see your code example here, without using any stylesheet. https://blazorfiddle.com/s/wocsxsy3