Mam następujący kod CSS

[PHP] pobierz, plaintext 
  		#roll2 { 
			margin: 1em; 
		}
		img { border: none; }
 
 
		#roll2 a.rollover {
			width: 200px;
			display: block;
			overflow: hidden;
		}
 
		#roll2 a.rollover img {
			display: block;
		}
 
		#roll2 a.rollover:hover img {
			margin-left: -200px;
		}
[PHP] pobierz, plaintext 

I chcę to wykorzystać w ten sposób

[HTML] pobierz, plaintext 
<div id="roll2">
<a class="rollover" href="http://rzeznia.eu/los.php"><img src="http://img.rzeznia.eu/kup_serwer.png" height="90" alt="Kup Serwer" /></a>
<a href="http://rzeznia.eu/click.php?id=6"><img src="http://img.amxboard.pl/r1.png" style="border: 0px none ; width: 500px; height: 90px;"></a>
<a class="rollover" href="http://rzeznia.eu/los.php"><img src="http://img.rzeznia.eu/kup_steam.png" height="90" alt="Kup Steam" /></a>
</div>
[HTML] pobierz, plaintext 

Występuje coś czego nie chcę - każdy obrazek jest w nowej linii zamiast jeden obok drugiego.
Jak prawidłowo powinien wyglądać ten kod?

A może zapisz wszystko w 1 lini? ^^

[HTML] pobierz, plaintext 
<div id="roll2">
<a class="rollover" href="http://rzeznia.eu/los.php"><img src="http://img.rzeznia.eu/kup_serwer.png" height="90" alt="Kup Serwer" /></a><a href="http://rzeznia.eu/click.php?id=6"><img src="http://img.amxboard.pl/r1.png" style="border: 0px none ; width: 500px; height: 90px;"></a><a class="rollover" href="http://rzeznia.eu/los.php"><img src="http://img.rzeznia.eu/kup_steam.png" height="90" alt="Kup Steam" /></a>
</div>
[HTML] pobierz, plaintext 

...

To chyba nie pomoże . Spróbuj w ten sposób: http://www.kurshtml.boo.pl/css/poziome_menu,menu.html

Lion_87 akurat to nie pomogło, bo tak też próbowałem i pierwotnie tak miałem, tylko ze względu czytelności dodałem odstępy przy wstawianiu na forum

230005 spróbuję.

@edit.
Udało się przy zastosowaniu float.