'da bir öğeye göre bir öğe diğerine konumlandırma Dört div
s değerini diğerine göre konumlandırmak istiyorum. Bir dikdörtgen div
var ve köşelerinde 4 div
s eklemek istiyorum. CSS'nin "position:relative"
özniteliğine sahip olduğunu biliyorum, ancak bu, bu öğenin normal konumuna göre. div
'ları normal konumlarına göre değil, başka bir öğeye (dikdörtgene) göre konumlandırmak istiyorum. Ne yapmalıyım?CSS
Q
CSS
27
A
cevap
23
Ben öğesi içinde mutlak konumlandırma kullanarak öneririm.
Bu JSfiddle'ı biraz görselleştirmenize yardımcı olmak için oluşturdum.
28
position: absolute
position: static
değildir yakın yerleştirilmiş atası, yani en yakın ana göre koordinatlara göre eleman konumlandıracaktır.
Dört divinizin hedef div içine yerleştirilmesini sağlayın, hedef div position: relative
verin ve diğerlerine position: absolute
kullanın.
Yapısı buna HTML benzer:
<div id="container">
<div class="top left"></div>
<div class="top right"></div>
<div class="bottom left"></div>
<div class="bottom right"></div>
</div>
Ve bu CSS çalışması gerekir:
#container {
position: relative;
}
#container > * {
position: absolute;
}
.left {
left: 0;
}
.right {
right: 0;
}
.top {
top: 0;
}
.bottom {
bottom: 0;
}
...
Ebeveyn öğesi ayrıntılarından emin değilseniz, ekran dinamik olduğunda bunu söyleyin. – abhi
Sorunun cevabı gerçekten değil. –
@ AndreasL.Agreed. Bence cevap basitçe yapamayacağın. Başka bir şey kullanarak yolunu kesmelisin. – CptAJ