Aspect Ratios

Simple Boxes

1:1

padding-top: 100%;

4:3

padding-top: 75%;

3:2

padding-top: 66.66%;

8:5

padding-top: 62.5%;

16:9

padding-top: 56.25%;

21:9

padding-top: 42.85%;

3:4

padding-top: 133%;

2:3

padding-top: 150%;

5:8

padding-top: 160%;

9:16

padding-top: 177%;

9:21

padding-top: 233%;

No Ratios

md-no-ratio

sm-no-ratio

xs-no-ratio

Boxes with Image Container

1:1 Aspect Ratio

padding-top: 100%;

4:3 Aspect Ratio

padding-top: 75%;

3:2 Aspect Ratio

padding-top: 66.66%;

8:5 Aspect Ratio

padding-top: 62.5%;

16:9 Aspect Ratio

padding-top: 56.25%;

21:9 Aspect Ratio

padding-top: 42.85%;