Click to See Complete Forum and Search --> : Formatting space only?


Chivalry
11-11-2004, 08:09 AM
I have a list of items that I use CSS to format. Here's what the list looks like:

<ul>
<li><a href="/">Home</a></li>
<li><a href="/products/">Products</a></li>
<li><a href="/services/">Services</a></li>
<li><a href="/support/">Support</a></li>
<li><a href="/news/">News</a></li>
<li><a href="/articles/">Articles</a></li>
<li><a href="/about/">About</a></li>
<li class="currentlistitem"><a href="/contact/"
style="background-color: #C4C769">Contact</a></li>
</ul>

My CSS file that is linked to this page formats each li so that it has a border along the right that matches the background color of the current item (in this case, Contact).

Because there is a carriage return between each list item, a small space appears between this right hand border and the background color of the current item. Is there any way to remove this space and still have the formatting of the code be easy to read? In other words, can I get rid of the space without having to produce code like this:

<ul>
<li><a href="/">Home</a></li><li><a href="/products/">Products</a>...
</ul>

Thanks,
Chuck

NogDog
11-11-2004, 08:25 AM
Hopefully there's a "better" way to do this, but I've had success with this sort of thing, breaking the line on a space within the <a> tag:

<ul>
<li><a href="/">Home</a></li><li><a
href="/products/">Products</a></li><li><a
href="/services/">Services</a></li><li><a
href="/support/">Support</a></li><li><a
href="/news/">News</a></li><li><a
href="/articles/">Articles</a></li><li><a
href="/about/">About</a></li><li class="currentlistitem"><a
href="/contact/" style="background-color: #C4C769">Contact</a></li>
</ul>

Chivalry
11-12-2004, 12:56 AM
Thanks for the answer. I actually thought of that also, but I was hoping there was something else that wouldn't look so bad.

Thanks,
Chuck