CSS Rotate verschachteln?

[Catscratch]

Hallo,

ich möchte Objekte mit CSS drehen, was auch soweit ganz gut klappt. Jedoch habe ich jetzt Objekte innerhalb anderer, welche mitgedreht werden, aber gerade erscheinen sollen. Sprich, diese möchte ich nach dem Drehen des "Mutterobjekts" wieder zurückdrehen.

Das klappt bisher nicht.
So sieht das ganze aus.

Code: Alles auswählen

<div id="obj1">
  <div id="obj2" />
</div>


Code: Alles auswählen

#obj1 {
  -moz-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
}
#obj2 {
  -moz-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg); 
}


Ich hab die DIVs ineinander geschachtelt, da ich das DIV (obj2) relativ zum DIV (obj1) ausrichten muss und mir das am elegantesten erschien.

In meinem Fall ist DIV1 eine Grafik an der Text ausgerichtet werden soll (DIV2). Der Text soll mit der Grafik rotiert werden, aber immer gerade lesbar sein. Deswegen wollt ich den Text "zurück" rotieren.

Es klappt auch alles, außer die Rotation von obj2. Muss ich was beachten? Oder ist das gar nicht möglich?

Danke

[Azra]

Hm... vielleicht geht es, wenn du "obj1" relativ, und darin "obj2" absolut positionierst.