css Breite gleich wie Höhe funktioniert nicht

Question

Ich habe das versucht und funktioniert nicht.

div { 
    background:orange; 
    height:20%; 
    padding-left:20%; 
} 

Die Breite wird mit der Fensterbreite in Prozent verknüpft. Ich möchte die Breite gleich der Höhe in einem Prozentwert machen, und dies nur mit CSS tun.

here wo ich, dass

jede Hilfe bitte.

Answer 1

Bereitgestellt Sie sind in Ordnung, das Markup zu ändern, können Sie ein weiteres div hinzufügen und erreichen dies mit ein bisschen Pseudo-Elemente hinzugefügt. Benutzte das folgende Markup.

<div class="parent"> 
<div class='child'></div> 
</div> 

div.child { 
 
    background: orange; 
 
    height: 20%; 
 
    margin-right: 80%; 
 
} 
 
.child:after { 
 
    content: ""; 
 
    display: block; 
 
    padding: 50% 0%; 
 
} 
 
div.parent { 
 
    width: 100%; 
 
    height: 100%: 
 
}

<div class="parent"> 
 
    <div class='child'></div> 
 
</div>