cssの幅が高さと同じでない

Question

私はこれを試して、動作していません。

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

ウィンドウの幅にパーセンテージで関連付けられます。 幅を高さとパーセント値で同じにしたいのですが、それはCSSだけで行います。私は任意のヘルプ

ことをしてくださいました

here。

Answer 1

を変更しても問題ありません。もう1つのdivを追加して、疑似要素を追加してこれを達成できます。以下のマークアップを使用しました。

<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>