Whitespace affects padding in inline list

[janedenone]

Hi,

I use the following CSS to display a breadcrumb path:

#breadcrumbs li {
list-style: none;
display: inline;
padding-right: 0.2em;
color: #369;
}
#breadcrumbs li:before {
content: "→";
padding-right: 0.5em;
}
#breadcrumbs li.first:before {
content: "";
padding-right: 0em;
}


When the <li> are divided by line breaks, the result looks just as
desired. But without whitespace, the "before" character appears too
close to the preceding element. Example:

http://janeden.django/12293

How can I prevent the linebreaks from affecting the layout? The white-
space property obviously does not provide a setting to ignore
whitespace within an environment completely.

Thanks in advance,
Jan

[janedenone]

Sorry, I provided the URL of my internal test server. The correct URL
is

http://janeden.net/12293

[RobS]

Browsers should collapse multiple white spaces into one. So you could
include a space charater in your content declaration, like so...
content: " →"; (note the space before the arrow). Then, whether or
not you have line breaks in your code, there will always be one white
space to the left of the arrow.

Rob