Use percentages in responsive embed modifiers

- Credit: @adammacias - Originally proposed in #16499 with previous commit

Use percentages in responsive embed modifiers
- Credit: @adammacias - Originally proposed in #16499 with previous commit
df2ca92d · Mark Otto · 331b8d22 · df2ca92d
Commit df2ca92d authored 9 years ago by Mark Otto
Hide whitespace changes
Inline Side-by-side

Showing

with 3 additions and 3 deletions
+3 -3
--- a/scss/_responsive-embed.scss
+++ b/scss/_responsive-embed.scss
@@ -28,15 +28,15 @@

 // Modifier class for 21:9 aspect ratio
 .embed-responsive-21by9 {
-  padding-bottom: 42.85%;
+  padding-bottom: percentage(9 / 21);
 }

 // Modifier class for 16:9 aspect ratio
 .embed-responsive-16by9 {
-  padding-bottom: 56.25%;
+  padding-bottom: percentage(9 / 16);
 }

 // Modifier class for 4:3 aspect ratio
 .embed-responsive-4by3 {
-  padding-bottom: 75%;
+  padding-bottom: percentage(3 / 4);
 }