diff options
| author | Richard Kraaijenhagen <[email protected]> | 2015-11-23 19:50:38 -0800 |
|---|---|---|
| committer | Chris Rebert <[email protected]> | 2015-11-23 19:54:55 -0800 |
| commit | c960169807102d1f78b700fbadac44106ff06716 (patch) | |
| tree | 09e5a9b4dcd1ddc6217b3db3eb327949e406e34b | |
| parent | 569f86051ee5cbaf6049e5a39b3fe939b7a16674 (diff) | |
| download | bootstrap-c960169807102d1f78b700fbadac44106ff06716.tar.xz bootstrap-c960169807102d1f78b700fbadac44106ff06716.zip | |
Add responsive embed class for 1:1 aspect ratio
Closes #18141
| -rw-r--r-- | docs/components/utilities.md | 5 | ||||
| -rw-r--r-- | scss/_responsive-embed.scss | 4 |
2 files changed, 9 insertions, 0 deletions
diff --git a/docs/components/utilities.md b/docs/components/utilities.md index 3bc054774..c2ac73bbc 100644 --- a/docs/components/utilities.md +++ b/docs/components/utilities.md @@ -328,4 +328,9 @@ Aspect ratios can be customized with modifier classes. <div class="embed-responsive embed-responsive-4by3"> <iframe class="embed-responsive-item" src="..."></iframe> </div> + +<!-- 1:1 aspect ratio --> +<div class="embed-responsive embed-responsive-1by1"> + <iframe class="embed-responsive-item" src="..."></iframe> +</div> {% endhighlight %} diff --git a/scss/_responsive-embed.scss b/scss/_responsive-embed.scss index aaf8c0470..244321959 100644 --- a/scss/_responsive-embed.scss +++ b/scss/_responsive-embed.scss @@ -33,3 +33,7 @@ .embed-responsive-4by3 { padding-bottom: percentage(3 / 4); } + +.embed-responsive-1by1 { + padding-bottom: percentage(1 / 1); +} |