回答編集履歴

1 誤字修正

aKusano

aKusano score 3725

2015/09/16 14:27  投稿

私も先日までMasakazuFukamiさんと同じ方法でCSSで縦横比固定をしてたんですが、
某セミナーで「自分のwidthを基準に縦横比を固定する方法」を教えてもらい、目からウロコでしたので
共有しておきます。
```CSS
.box{
 position:relative;
 width:30%;←ここは任意の数
}
.box:before{
 paddint-top: 150%; ←親要素.boxに対する比率
 padding-top: 150%; ←親要素.boxに対する比率
}
.box__inner{
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
}
```
これは便利w

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る