From 331b8d2250f4b1ba29c0833e2be770c3f743ffe5 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 18 Jun 2015 16:01:52 -0700 Subject: Add 21x9 responsive embed modifier - Credit: @adammacias - Fixes #16499 --- scss/_responsive-embed.scss | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'scss/_responsive-embed.scss') diff --git a/scss/_responsive-embed.scss b/scss/_responsive-embed.scss index c1ef6cb4b..bedab270a 100644 --- a/scss/_responsive-embed.scss +++ b/scss/_responsive-embed.scss @@ -26,6 +26,11 @@ } } +// Modifier class for 21:9 aspect ratio +.embed-responsive-21by9 { + padding-bottom: 42.85%; +} + // Modifier class for 16:9 aspect ratio .embed-responsive-16by9 { padding-bottom: 56.25%; -- cgit v1.2.3 From df2ca92d7704d54a15be54e5da8086712bd18680 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Thu, 18 Jun 2015 16:03:48 -0700 Subject: Use percentages in responsive embed modifiers - Credit: @adammacias - Originally proposed in #16499 with previous commit --- scss/_responsive-embed.scss | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'scss/_responsive-embed.scss') diff --git a/scss/_responsive-embed.scss b/scss/_responsive-embed.scss index bedab270a..772b853c7 100644 --- 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); } -- cgit v1.2.3