Uchyceni objektu ve tride DIV pomoci CSS

Mám níže uvedený skript a chtěl bych dosáhnout toho,abych nemusel mít třídy vrsek a spodek,a měl vše v hlavní "Bunka", tz. obrázky prichytit jeden k vršku buňky a druhy ke spodu. Normalne bych pouzil background: url(vrsek.gif) no-repeat top left; ale to se prichyti jen k vrchu. Poraďte prosím jak současně přichytit i ke spodu.

..skript
<div class="Bunka">
<div class="Vrsek"></div>
<div class="Obsah4">
<div class="Img"></div>
<div class="Text"></div>
</div>
<div class="Spodek"></div>
</div>

..css soubor
.Bunka {width:130px; height:205px; float: left;}
.Vrsek {width:130px; height:15px; background: url(vrsek.gif) no-repeat;}
.Spodek {width:130px; height:15px; background: url(spodek.gif) no-repeat;}
.Obsah {background: url(box_podklad.gif) repeat}
.Img {width: 122px; height: 115px;}
.Text {width: 122px; height: 60px;}

To nejde, do jednoho divu dvě pozadí nedáš. Ale můžeš to pozadí z Vrsek nebo Spodek dát už pro Bunka a tím se zbavíš aspoň jednoho divu.

Nijak. Nejde to.
Nemůžeš jednomu prvku nastavit dva odporující si styly (background-position: top; background-position: bottom) a žádný zápis css sloužící k nastavení dvou obrázků, jednoho dolů a jednoho nahoru, neexistuje.

No tak nic :)
Psal jsem to moc dlouho, mezitím odpověděl někdo jiný.