Flera backgrounds i en klass?

<div class="box-topcenter">
<div class="box-topleft">
<div class="box-topright">
<div class="box-centerleft">
Innehållet i boxen
</div>
</div>
</div>
</div>

Jag håller på och bygger upp en site som ska bestå av ett antal boxar. Varje box måste i dagsläget bestå av 8 divar med olika klasser (en för övre vänstra hörnet, en för övre högra hörnet osv..). Kan jag på något sätt göra så att det räcker med ett divlager (och därmed bara en "box"-class)? Det känns väldigt onödigt att behöva skriva ut alla dessa div-lager för varje box nämligen.

.box {
	width: 150px;
	background-image: url("images/box-topleft.gif");
	background-position: top left;
	background-repeat: no-repeat;
	background-image: url("images/box-topright.gif");
	background-position: top right;
	background-repeat: no-repeat;	
	/*...osv..*/
}
...

<div class="box">
Box!
</div>