Gibt es eine Möglichkeit, die Breite zu lesen und eine Höhe mit demselben Wert einzustellen? Ich kenne den Trick mit viewhartheight [vh] und [vm], aber es wird hier nicht gut funktionieren.Einen quadratischen div mit Vererbung oder etw machen? (no js)
Sie können es tun, indem Sie die Tatsache verwenden, dass in padding-bottom: 100% der Prozentsatz Prozent der Breite ist, und nicht die Höhe. Wenn Sie also ein Pseudo-Element mit padding-bottom: 100% setzen, ändert sich die Höhe entsprechend der Breite. Der Inhalt kann sich in einer absoluten Positionsebene befinden.
.container {
position: relative;
width: 100px;
}
.container:hover {
width: 150px;
transition: width 2s;
}
.container::before {
display: block;
padding-bottom: 100%;
content: '';
}
.content {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: red;
}<div class="container">
<div class="content">
</div>
</div>nett :) etwas, das ich gesucht habe – Dawid
Nicht ohne Skript (ich habe ein wenig schweben Animation zeigen, dass das Ändern Breite ändert sich auch die Höhe hinzugefügt). Was willst du erreichen? – LGSon
wollte nur wissen, ob es eine Möglichkeit gibt, es mit der Vererbung oder durch die Spiegelung Paddings einer Art zu tun – Dawid
@Ori Drori gepostet eine gute Lösung für Sie. – LGSon