Skip to content
GitLab
Commit 6a5a83e0 authored by なつき's avatar なつき Committed by Mark Otto
Browse files

Fix responsive embed class in flex container

parent 026e1a14
Hide whitespace changes
Inline Side-by-side
Showing
with 18 additions and 5 deletions
+18 -5
scss/_responsive-embed.scss
+ 18
- 5
View file @ 6a5a83e0
...@@ -3,10 +3,15 @@ ...@@ -3,10 +3,15 @@
.embed-responsive { .embed-responsive {
position: relative; position: relative;
display: block; display: block;
height: 0; width: 100%;
padding: 0; padding: 0;
overflow: hidden; overflow: hidden;
&::before {
display: block;
content: "";
}
.embed-responsive-item, .embed-responsive-item,
iframe, iframe,
embed, embed,
...@@ -23,17 +28,25 @@ ...@@ -23,17 +28,25 @@
} }
.embed-responsive-21by9 { .embed-responsive-21by9 {
padding-bottom: percentage(9 / 21); &::before {
padding-top: percentage(9 / 21);
}
} }
.embed-responsive-16by9 { .embed-responsive-16by9 {
padding-bottom: percentage(9 / 16); &::before {
padding-top: percentage(9 / 16);
}
} }
.embed-responsive-4by3 { .embed-responsive-4by3 {
padding-bottom: percentage(3 / 4); &::before {
padding-top: percentage(3 / 4);
}
} }
.embed-responsive-1by1 { .embed-responsive-1by1 {
padding-bottom: percentage(1 / 1); &::before {
padding-top: percentage(1 / 1);
}
} }
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment