webForumDet fria alternativet

div i och över annan div

HTML & CSSur HTML, XHTML & CSS

1 svar · 1 040 visningar · startad av room

Medlem sedan mars 2001270 inlägg
Frågan#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.

132 ms totalt · 3 externa anrop · v20260731065814-full.4bcf49fe
0 ms — hämta forumlista (cache)
0 ms — hämta statistik (cache)
129 ms — hämta tråd, inlägg och bilagor (db)