XHTML STRICT centring text horizontally and vertically in an ahref tag

Get Started
1

I want to align text in the middle of a button xhtml strict. Code below. I have tried aligning the text in the ahref, putting a span around the text and adding margin, "works in ie but not “firefox” and everything else, the origional is here http://ewto.at/wingtsun ITS THE LEFT NAV and it works but I cant fathom out how they have done it. HELP PLEASE.

i JUST WANT TO CONTROL THE TEXT WITHIN AN AHREF, you would have thought they would make this easy surley, It probably is. No , actually…

<div class=“side_nav_box”>

		&lt;span id="enquiry_form_image"&gt; 
        		&lt;a href="enquiry_form.html" id="enquiry_form"&gt;
					&lt;img src="images/redbutton.gif" alt="fill our contact form out" width="170" height="71" /&gt;					&lt;/a&gt;            &lt;/span&gt;

&lt;ul id="side_navigation"&gt;

    &lt;li id="side_nav_shop"&gt;
    	&lt;a href="shop.html"&gt;
        		&lt;span&gt;Shop&lt;/span&gt;            &lt;/a&gt;      &lt;/li&gt;
    
  &lt;li id="side_nav_ewtbo"&gt;
    &lt;a href="http://ewto.at/wingtsun"&gt;
    		EWTO BO        &lt;/a&gt;      &lt;/li &gt;
    
  &lt;li id="side_nav_links"&gt;
    &lt;a href="http://ewto.at/chikung"&gt;
    		Links        &lt;/a&gt;      &lt;/li&gt;

</ul>
</div>

.side_nav_box{
width:250px;
height:auto;
position:absolute;
top:100px;
left:300px;
}

ul#side_navigation{
width:100%;
height:80px;
margin-left:35px;
margin-top:10px;
float:left;
}

ul#side_navigation li{
text-align:center;
list-style:none;
background: url(images/nav_arrow.gif) no-repeat 5px 9px;
width:auto;
height:30px;
}

#side_navigation li a{
height:30px;
font:normal 1.1em ‘Trebuchet MS’,Verdana, Arial, Helvetica, sans-serif;
color:#aa0000;
text-decoration:none;
display:block;
width:100%;
margin-left:20px;
}

#side_navigation li a span{
margin-top:30px;
height:1.1em;
width:100%;
border: 1px #000000 solid;
display:block;
}

#side_navigation li a:hover{
background:url(images/side_nav_bg.jpg) repeat-x 0px 0px;
}