little gap between img and surounding li - firefox only

[jens1701]

Hi,

i found this problem while designing a page with firefox. The gap is not coming from padding or margins. The Problem is not visible in Opera or IE. Please see the attached images for best explanation.
Please help.
Jens

Here my code:

<ol id="teaser">
		<li class="item">
	      	<h2 class="hideme"><a href="#1" >Messe</a></h2>
			<img src="images/teaser_one.jpg" alt="Lorem Ipsum Dolor Siamet"/>
			<p class="hideme"><strong>Teaser one </strong>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et.</p>
        </li>
		<li class="item">
          	<h2 class="hideme"><a href="#2">Aktion</a></h2>
			<a href="#2"><img src="images/teaser_two.jpg" alt="Lorem Ipsum Dolor Siamet"/></a>
			<p class="hideme"><strong>Teaser two </strong>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et.</p>
        </li>
...

	OL#teaser {
		margin:0;
		padding: 10px 0;
		text-align: center;
	}
	OL#teaser li {
		display: inline-block;
		width: 481px;
		border: 3px solid;
		margin: 0 0 6px 0;
		padding:0;
		
	}

[Kor]

Give us a link to your test page