Layers

Kig på http://home13.inet.tele.dk/smedpark/test/centrer2a.htm

Jeg har ikke sat z-index, det er ikke nødvendigt, hvis lagene står i rigtig rækkefølge, bagerst først osv.

Men ellers kan du godt gøre det.

Hele sidens kode kommer her, men ellers kan det jo også ses på sidens kildekode.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>centrering</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type ="text/css">
<!--

.div1     {
      position : absolute;
      top : 50% ;
      left : 50% ;
      width : 536px ;
      height : 361px ;
      margin-top : -181px ;
      margin-left : -268px ;
      margin-right : auto ;
      margin-bottom : auto ;
      padding : 0
    }
.div2    {
    color: white;
    background-color: green;
    width: 200px;
    height: 200px;
    position: absolute;
    left: 20px;
    top: 30px;
    margin-right: auto;
    margin-bottom: auto;
    padding: 0
    }
-->
</style>
</head>
<body>

<div class="div1">
<img src="ae714.jpg" width="536" height="361" alt="tog, Schweiz">
<div class="div2">
<h1>Bla - Bla</h1>
</div>
</div>
</body></html>

njaaa hvad nu hvis layer2 ikke skal være indeni layer1 men overlappe det, så noget af det er indeni og noget udenfor

Så kunne du fx. blot ændre top og left til fx. 50% ligesom div1, samt "un-neste" div tagsne.

jaa men hvis jeg nu vil have lag 2 til bare at overlappe top med 15 px, så er det jo lidt svært når man arbejder i %

Så brug relativ positionering ift. div1

Njaaaa, men det SKAL være 15px den overlapper div1. og det er ret vigtigt det er helt nøjagtigt

So, derfor kan du da sagtens bruge relativ p

Noget alá (utestet)

<html>
<head>
<title>centrering</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type ="text/css">
<!--
.div1 {
    position : absolute;
    top : 50% ;
    left : 50% ;
    width : 536px ;
    height : 361px ;
    margin-top : -181px ;
    margin-left : -268px ;
    margin-right : auto ;
    margin-bottom : auto ;
    background-color: #eee;
}
.div2 {
    color: white;
    background-color: green;
    width: 200px;
    height: 200px;
    position: relative;
    left: 0px;
    top: -15px;
}
-->
</style>
</head>
<body>
<div class="div1">
<div class="div2">
<h1>Bla - Bla</h1>
</div>
</div>
</body>
</html>

ok'er det vil jeg lige prøve. Du hører fra mig senere idag.

har kigget på det nu pelkjaer>> og hvis du vil have point så skal du komme med et svar :)

pelkjaer>> hvaaa vil du ikke have point :)

svar :)

ok'er og takker