template: Tweak images to better fill breakpoints.

This commit is contained in:
Bradley Sepos 2016-04-06 18:49:12 -04:00
parent 7ebd9ab10e
commit e4c6bc6382

View File

@ -130,14 +130,13 @@ article.docs footer .contributing {
} }
article.docs figure { article.docs figure {
display: inline-block; display: block;
position: relative; margin: 1.33333em auto;
left: -5%; width: 100%;
margin: 1.33333em 0;
} }
article.docs figure img { article.docs figure img {
max-width: 110%; max-width: 100%;
} }
article.docs figcaption { article.docs figcaption {
@ -155,7 +154,9 @@ article.docs figcaption {
/* Wider than 550 */ /* Wider than 550 */
@media (min-width: 550px) { @media (min-width: 550px) {
article.docs figure {
width: 80%;
}
} }
/* Wider than 750 */ /* Wider than 750 */
@ -163,16 +164,20 @@ article.docs figcaption {
article.docs { article.docs {
padding-left: 40px; padding-left: 40px;
padding-right: 40px; padding-right: 40px;
max-width: 650px; max-width: 600px;
} }
article.docs figure { article.docs figure {
max-width: 45%; display: inline-block;
margin: 1.33333em 0;
position: relative;
left: -5%;
max-width: 42%;
vertical-align: top; vertical-align: top;
} }
article.docs figure + figure { article.docs figure + figure {
margin-left: 5%; margin-left: 3%;
} }
article.docs figure img { article.docs figure img {
@ -190,6 +195,11 @@ article.docs figcaption {
article.docs figure { article.docs figure {
left: -10%; left: -10%;
max-width: 45%;
}
article.docs figure + figure {
margin-left: 5%;
} }
} }