Tiny clickable area in Firefox - css

Question

In Firefox, the clickable area of the links in my footer is TINY. The clickable area does not span the entire label - both in terms of width and height. In IE, it's fine. Any ideas?
Here is my footer code:
<div id="footer">
<ul>
<li>RKM Research and Communications, Inc. |</li>
<li>1039 Islington St |</li>
<li>Portsmouth, NH 03801 |</li>
<li>603.433.3982 |</li>
<li>email us</li>
</ul>
<ul class="copyright">
<li>© 2012 RKM Research and Communications, Inc. </li>
<li>Privacy policy </li>
<li>Terms of use</li>
</ul>
and my CSS:
div#footer ul li{
color : #036;
background-color : transparent;
display: inline
}
div#footer ul li a{
color : #115EAC;
text-decoration : none;
display:inline-block;
paddding:10px 20px;
}
.footer ul li a:hover{color:#F6901E;
text-decoration : underline;
}
I've even tried to apply a block style using a class, but it still did not help:
<li class="flink">email us</li>
</ul>
css:
.flink ul li a{
color : #115EAC;
text-decoration : none;
display:block;
paddding:10px 20px;
float:left;
}

Answer 1

Small world, I also live in Portsmouth.
With the code you provided, the clickable area is just as it should be. You can verify this here: http://jsfiddle.net/cCDaL/1/
I've made the background of each a element yellow, so you can see exactly what the clickable area is, and it is indeed what it should be.
I think the answer to your problem is that you have another CSS rule that is making the clickable area tiny, possibly line-height or padding (padding is not clickable in links). You can use the Chrome or Firefox inspectors to see what could be the problem here.
Another edit: In Firefox Aurora 14.0a2, the clickable area is indeed also normal, for me, on your website http://www.rkm-research.com/. Here's a screenshot with the Firefox inspector: