Problem bei der Formatierung mit CSS

[Manny]

Hallo,

ich versuche derzeit mich ein wenig in CSS und HTML. Dabei bin ich nun langsam mal an meine Grenzen gestoßen. Deswegen hoffe ich kann man mir helfen. Mein Code sieht wie folgt aus:

<div id="Artikel">  
  <strong>Fisch</strong>  
</div>  
<hr/>  
<div id="Artikel">  
  <div class="gerichtnummer">1</div>  
  <div class="gerichtueb">Fisch mit einem tollen Titel</div>  
  <div class="preis">6.90 &euro;</div>  
  <div class="subtitle">Eine Beschreibung die so lang sein kann, wie sie möchte. Deswegen ist es hier besonders wichtig, dass hier viel Platz für den Text ist.</div>  
</div>  
<hr/>  
<div id="Artikel">  
  <div class="gerichtnummer">2</div>  
  <div class="gerichtueb">Fisch</div>  
  <div class="preis">6.90 &euro;</div>  
  <div class="subtitle">Eine Beschreibung die so lang sein kann, wie sie möchte. Deswegen ist es hier besonders wichtig, dass hier viel Platz für den Text ist.</div>  
</div>  
<hr/>  
<div id="Artikel">  
  <div class="gerichtnummer">3</div>  
  <div class="gerichtueb">Fisch</div>  
  <div class="preis">6.90 &euro;</div>  
  <div class="subtitle"></div>  
</div>  
<hr/>  
<div id="down">  
  <center>Hier finden Sie unsere Men&uuml;karte zum Download: <a href="#">Men&uuml;karte</a></center>  
  <hr>  
</div>

Hier mein bisheriger CSS Versuch: Es sieht in etwa so aus, wie es aussehen soll, aber leider immernoch nicht so ganz :/

  
#Haupttext hr {  
	margin: 10px 20px 10px 20px;  
}  
  
#Artikel  {  
	padding: 0px 15px 0px 15px;  
}  
  
#Artikel strong {  
	margin: 0 0 0 50px;  
	font-weight: bold;  
	font-size: 20px;  
}  
  
#Artikel .gerichtueb {  
	margin: 0 0 0 50px;  
	font-weight: bold;  
	font-size: 20px;  
	float: left;  
	width: 274px;  
}  
  
#Artikel .gerichtnummer {  
	position: absolute;  
	font-weight: bold;  
	font-size: 20px;  
}  
  
#Artikel .subtitle {  
	margin: 0 0 0 50px;  
	font-size: 10px;  
	float: left;  
	width: 274px;  
}  
  
#Artikel .preis {  
	text-align: right;  
	font-weight: normal;  
	font-size: 14px;  
	float: right;  
	width: 80px;  
}  

Am Ende soll es im Prinzip so aussehen, dass die Gerichtnummer vorne steht. Die Gerichtüberschrift und der Subtitle auf einer Linie etwas weiter rechts steht und die oben angegebenen 274px maximal breit wird. Auf der rechten Seite möchte ich den Preis stehen haben. Die Artikel sollen jeweils durch ein <hr/> voneinander getrennt werden (als optische Trennlinie) aber irgendwie funktioniert das alles nicht so, wie ich es mir wünsche :( Hoffe ihr könnt mir helfen.

mfg Manny