How can I prevent spaces between <a> tags being rendered?

How can I prevent spaces between <a> tags being rendered?

I've noticed that the asp.net CSS-Friendly GridView (e.g. with an
id="gvAwarded") is rendering html like this:

<div class="AspNet-GridView-Pagination AspNet-GridView-Bottom">
<span>1</span>
<a href="javascript:__doPostBack('gvAwarded','Page$2')">2</a>
<a href="javascript:__doPostBack('gvAwarded','Page$3')">3</a>
<a href="javascript:__doPostBack('gvAwarded','Page$11')">...</a>
<a
href="javascript:__doPostBack('gvAwarded','Page$Last')">&gt;&gt;</a>
</div>

I would prefer to creat the following html:

<div id="gvAwardedPager" class="AspNet-GridView-Pagination
AspNet-GridView-Bottom">
<span>1</span><a
href="javascript:__doPostBack('gvAwarded','Page$2')">2</a><a
href="javascript:__doPostBack('gvAwarded','Page$11')">...</a><a
href="javascript:__doPostBack('gvAwarded','Page$Last')">&gt;&gt;</a>
</div>

Why do browsers (FireFox and IE6) render the white space between the
<a> tags and how can I stop it? - short or rewriting the asp.net
GridView rendering code.


PS: This really is a pure CSS question as it relates to why I need to
remove whitespace between a list of <a> tags. I don't expect any
comments on asp.net because it's really nothing to do with the
fundamentals of this question (I will ask about modifying the asp.net
code elsewhere if I get no satisfaction here). The problem is with the
browsers.



Here are my styles (these class names are automatically rendered by the
aforementioned asp.net GridView.)

..AspNet-GridView-Bottom {margin:0;}
..AspNet-GridView-Pagination
{
font-family: Arial, Helvetica, sans-serif;
text-decoration: none;
font-size: 0.65em;
line-height: 19px;
}

..AspNet-GridView-Pagination a
{
margin:0;
display:inline;
border-collapse:collapse;
color: #555;
border-right: 1px solid #c5c5c5;
width: 3em;
text-align:center;
padding: 4px 6px 2px;
}

..AspNet-GridView-Pagination span
{
background-color: #CCC;
margin:0;
color: #000;
font-weight:bold;
border-top: 1px solid #CCC;
border-right: 1px solid #c5c5c5;
width: 3em;
text-align:center;
padding: 4px 6px 2px;
}

..AspNet-GridView-Pagination a:hover
{
color: #333;
background-color: #efefef;
border-top: 1px solid #c5c5c5;
}


.

Relevant Pages

  • Re: How can I prevent spaces between tags being rendered?
    ... Why do browsers render the white space between the ... GridView rendering code. ... .AspNet-GridView-Pagination ... border-right: 1px solid #c5c5c5; ...
    (comp.infosystems.www.authoring.stylesheets)
  • Re: asp.net and XHTML
    ... tags, and attribute values are included in double ... Controls do not render custom attributes that are ... Any script tags rendered into the page include an appropriate type ...
    (microsoft.public.dotnet.framework.aspnet)
  • Re: Insert a custom TAG first in body
    ... What I need is to render a psecial tag requiered by local mobile provider ... > ASP.NET Engine to replace those tags with equivalent tags in the markup ... > adapters that render mobile controls into specific tags of a given markup ...
    (microsoft.public.dotnet.framework.aspnet.mobile)
  • Re: dentalcom.net - smd gateway
    ... I can embed graphics into DentalCom.net by enclosing ... software will render the image and replace the code with an image. ... The tags are vBulletin tags. ...
    (sci.med.dentistry)
  • Re: GridView Height
    ... The gridview rows are rendered as elements within the ... gridview would have to render an extra row + a ... cell that spans the entire of this extra row which fills the remaining ... gridview footer and making the footer height fill this extra space. ...
    (microsoft.public.dotnet.framework.aspnet.webcontrols)