Css-klasser som stör varandra

Hejsan!
Jag har två css-klasser (item-continued och item-continues) som jag använder i en tabellbaserad kalender. Det klasserna ska göra är att lägga till en pil till vänster respektive höger (bakgrundsbild) om en kalenderhändelse sträcker sig över veckogränsen (typ torsdag till måndag). Det fungerar kanon om bara en pil ska visas, men om det ska visas en åt varje håll (ex händelsen börjar onsdag v1 och slutar torsdag v3. Då ska det bli pilar åt båda hållen i v2.).

Verkar som man bara kan ha en bakgrundsbild per cell. Men man kanske kan lägga dem i olika lager på något vänster?

<td colspan="7">
	<div class="item-content item-continued  item-continues  event-multiday">
		<div class="t2 tbg"></div>
			<div class="t0 tbg">
				<a class="event-link" href="#cykel" target="_blank">
					<span class="event-summary">2283</span>
				</a>
			</div>
		<div class="t2 tbg"></div>
	</div>
</td>

.month-table .item-continued .t0{padding-left:8px;background-image:url(moreleft.gif);background-position:left;background-repeat:no-repeat}

.month-table .item-continues .t0{padding-right:8px;background-image:url(moreright.gif);background-position:right;background-repeat:no-repeat}

Det är väl klart att man bara kan ha en bakgrund.
Det går ju att lösa på olika sätt, antingen så får du skapa en tredje klass med 2 pilar eller så kan du skippa att lägga till det i CSS och helt enkelt visa bilderna beroende på hur långt eventet sträcker sig.

Menar du att den tredje klassen ska ha en bakgrund som består av båda pilarna? Det går inte, man ska kunna ändra storleken på cellerna utan att pilarna försvinner. Att infoga bilder med pilarna undviker jag så långt det går. Allt genereras dynamiskt och om jag ska börja pilla på en massa undantag här och där så blir det garanterat strul.

Inga andra idéer?

I CSS3 ska det gå att ange flera bakgrundsbilder samtidigt, men jag tror att det endast fungerar i Safari nu, så det gör väl inte dig gladare kanske :-)

Det borde dock, som du är inne på, gå att lägga bakgrundsbilderna på två olika element. Typ att du lägger pilen till vänster på .t0 (som nu) och pilen till höger på någon av de intilliggande taggarna. Men det beror också lite på hur css-koden ser ut i övrigt... Det går inte att se sidan någonstans så man vet vad som går/inte går att ändra på i css-väg?

Man kanske kan göra en javascript-grej, letar upp alla element som har båda klasserna och sen infogar ett nytt element (med pilen i) i det första elementet?

Hela sidan kan ses på: http://forte.x-group.se/wf.html (Japp, det är en klockren rippoff av google calendar) :r

Det allra enklaste sättet att lösa det på borde vara att slänga in en extra div-tagg. Om du har möjlighet att göra det. (Och så kan det säkert komma lite protester på att man inte ska slänga in en massa taggar enbart i presentationssyfte, men what the hey - du har ju redan ett gäng sådana taggar, så det går ju i alla fall att föreslå tänkte jag...) Typ såhär då:

<td colspan="7">
	<div class="item-content item-continued  item-continues  event-multiday">
		<div class="t2 tbg"></div>
			<div class="t0 tbg"><div class="t3">
				<a class="event-link" href="#cykel" target="_blank">
					<span class="event-summary">2283</span>
				</a>
			</div></div>
		<div class="t2 tbg"></div>
	</div>
</td>

.month-table .item-continues .t3 { ... }

En extra div att lägga högerpilen i med andra ord... Vänsterpilen behåller du i din .t0:a. Det skulle säkert gå att lägga någon av pilarna som bakgrund på någon av de taggar som redan finns, men jag har inte tid att greja med det ikväll, för det kräver nog lite mer ändringar i dina css:er skulle jag tippa...

Kruxet är då att jag måste in och pilla i htmlkoden, vilket jag vill undvika så långt det bara går. Eventuellt skulle man kunna pilla i koden mha javascript.. Får fundera vidare, tack för hjälpen i alla fall! :)