div i och över annan div

HTML & CSS

1 svar · 1 051 visningar · startad av room

Medlem sedan mars 2001270 inlägg
Trådstart#1

Hej! Skulle vilja ha svar på följande:

Vill placera en Div inuti och över en annan div. Det skall vara på vissa produkter som skall markeras med en liten Ikon typ NYHET 2010.

Strukturen ser ut så här:

<style type="text/css">
<!--
#plan {margin:0 10px 10px 0; width:225px; height:120px; background:url(style/gfx/bg_plans.png) no-repeat;}

#planHead {color:#333; padding:5px; text-align:center; width:215px; height:14px; font-weight:bold;}

#planCont {text-align:center; width:225px; height:66px; padding:15px 0 15px 0;}
</style>

<a href="?content=showdetail&id=53">
   <div id="plan">
      <div id="planHead">560 UF</div>
      <div id="planCont">
         <img src="dynamic/plans/royale_560uf.gif" alt="560 UF" height="65" />
      </div>
   </div>
</a>

Hur gör jag nu för att få en div som blir lika stor som den första divven och lägger sig ovanpå där jag kan lägga in en transparent png?

Tacksam för svar!

Medlem sedan aug. 20068 090 inlägg
#2

Du kan t.ex. göra "föräldern" relative, dvs ha "position:relative" i stlmallen. Sen gör du "barnet" absolute eller relative också, dvs tar "position: absolute" eller "position:relative" i stilmallen och sätter värdet "top:-200px;" eller nåt. Du kan även behäva ge "barnet" ett högre z-index, dvs "z-index:100" eller liknande i stilmallen.

Jag skjuter från höften utan att ha testat, men något sånt borde funka. Men kolla noggrannt i flera webbläsare. Bl.a. IE8/Win hanterar överlappande element lite konstigt ibland.

247 ms totalt · 4 externa anrop · v20260731065814-full.d34c6d5a
121 ms — deklarationer (db)
0 ms — hämta statistik (cache)
118 ms — hämta tråd, inlägg och bilagor (db)
124 ms — ändringar (db)