This works but I think there should be a better cure:-
<ul id="nav">
<li><a href="#" id="anews"></a></li>
<li style="margin-top: -2px;"><a href="#"
id="abio"></a></li>
<li style="margin-top: -2px;"><a href="#"
id="agigs"></a></li>
<li style="margin-top: -2px;"><a href="#"
id="apics"></a></li>
<li style="margin-top: -2px;"><a href="#"
id="alinks"></a></li>
<li style="margin-top: -2px;"><a href="#" id="acontact"></a></li>
</ul>
Notice that the first li tag for anews does not have the margin style. Firefox is unaffected but in IE7 it raises the second to last images up in line with the first.
Code downloaded to my PC will be deleted in due course.
WIN7; IE9, Firefox, Opera, Chrome and Safari for Windows; screen resolution usually 1366*768.
Also IE6 on W98 with 800*600 and IE8 on Vista 1440*900.