Bin gerade dabei eine Bildergallerie zu gestalten, die Grundfunktionen stehen auch soweit, mir geht es nun um die Optik.
Wenn auf ein Bild geklickt wird, dann soll das von den Seitlichen Aspekten, also links und rechts mittig im Bildschirm angezeigt werden. Also hatte ich mir gedacht ich umschließe einfach ein position:absolute mit einem relative element und stelle dann die außenränder entsprechend ein.
Mein Problem, das realtive Element umschließt ein anderes realtive Element und das umschlossene realtive Element orientiert sich an dem Übergeordnetem relative Element und nicht am Dokumentrand, wieso?
Hier mal ein testquellcode:
Vielen Dank schon einmal im Vorraus für eure Hilfe!
Wenn auf ein Bild geklickt wird, dann soll das von den Seitlichen Aspekten, also links und rechts mittig im Bildschirm angezeigt werden. Also hatte ich mir gedacht ich umschließe einfach ein position:absolute mit einem relative element und stelle dann die außenränder entsprechend ein.
Mein Problem, das realtive Element umschließt ein anderes realtive Element und das umschlossene realtive Element orientiert sich an dem Übergeordnetem relative Element und nicht am Dokumentrand, wieso?
Hier mal ein testquellcode:
Code:
<body>
<style type="text/css">
.main
{
position:relative;
top:100px;
left:50px;
height:500px;
width:1000px;
background:#00C;
}
.main2
{
position:relative;
top:0px;
left:0px;
height:400px;
width:1000px;
background-color:#000;
}
.sub
{
position:absolute;
top:50px;
left:0px;
height:200px;
width:500px;
background-color:#FFF;
border:solid 20px #FFF;
margin-left:200px;
}
</style>
<div class="main">
<div class="main2">
<div class="sub">test</div>
</div>
</div>
</body>
Vielen Dank schon einmal im Vorraus für eure Hilfe!