height degerini width degerine esitleme
merhaba width degerini 33% yapiyorum yani ekrani 3 esit hisseye boluyorum icine yuvarlak div yerlestiriyorum simdi height degerini ekran asagiya dogru uzadigi icin % olarak veremiyorum px olarak veriyorum bu da farkli cep telefonu boyutlarinda ekranin genisliyi deyisdiyi icin yuvarlakda bozulmalar oluyor genislik azaldikca yuvarlak ellips formasina donusuyor bunun karsisini nasil ala bilirim height degerini css te width degerine nasil esitleye bilirim yani width ne kadar pixel olsa otomatik height degeri de width e gore deyissin ve anki kadar pixel olsun
Merhaba, bunun için padding-bottom kullanabilirsiniz. Yuvarlak div’iniz için border-radius özelliğini kullanarak yuvarlak oluşturabilirsiniz. Ardından padding-bottom özelliğine yüzde olarak bir değer atayabilirsiniz. Bu değer, div’inizin genişliğinin yüzdesi olarak ayarlanabilir. Bu sayede, genişlik küçüldükçe dikey yükseklik de orantılı olarak küçülecektir.
Örneğin, aşağıdaki CSS kodu ile 4:3 oranında bir yuvarlak div oluşturabilirsiniz:
div {
width: 33%;
border-radius: 50%;
padding-bottom: 75%; /* 4:3 oranı için */
}
Bu şekilde, yuvarlak div’iniz her ekrana göre doğru şekilde ölçeklenecektir. Eğer farklı bir oran kullanmak isterseniz, padding-bottom özelliğindeki yüzde değerini değiştirebilirsiniz.