<img> in <li> - Browserprobleme bei position:relative

Ich habe eine Navigation, die eine im hover aufgeklappte Subnavigation enthält. Die einzelnen li’s der normalen Navigation sind Images (fragt nicht warum, aber das muss so sein)
Um die Subnavigation zu positionieren setze ich die li relativ und die Subnavigation absolute. Leider umschließt das li die images nicht, wodurch die Positionierung in den Browsern abweicht (Im Anhang ein Screenshot [rote Border: li, grüne Border: img])

Wie schaffe ich es, dass die li das image umschließt (im IE tut sie das übrigens, aber nur „aus Versehen“.

Code:

#nav .navcontent ul li.nav1 {display: inline;padding:0; margin:0;line-height:0px; font-size: 0px;height:22px;z-index: 2;position: relative; top:0; left:0;border: 1px solid red;} #nav .navcontent ul li.nav1 img {margin:0; padding: 0;line-height: 0px;position:relative;top:0;left:0;border: 1px solid green;}

Für jegliche hilfreiche Kommentare dankbar,
Soophie