Sophisticated Business: Fix overflowing centred image
This commit is contained in:
parent
164a54b704
commit
2e04c8ba23
4 changed files with 7 additions and 56 deletions
|
@ -518,33 +518,12 @@
|
|||
|
||||
//! Image
|
||||
.wp-block-image {
|
||||
max-width: 100%;
|
||||
|
||||
img {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.aligncenter {
|
||||
|
||||
@include postContentMaxWidth();
|
||||
|
||||
@include media(tablet) {
|
||||
margin: 0;
|
||||
width: $size__site-tablet-content;
|
||||
|
||||
img {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
@include media(desktop) {
|
||||
width: $size__site-desktop-content;
|
||||
|
||||
img {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.alignfull img {
|
||||
width: 100vw;
|
||||
max-width: calc( 100% + (2 * #{$size__spacing-unit}));
|
||||
|
|
|
@ -114,7 +114,6 @@ div#jp-relatedposts div.jp-relatedposts-items .jp-relatedposts-post .jp-relatedp
|
|||
/**
|
||||
* Blocks
|
||||
*/
|
||||
|
||||
/* Mailchimp Block - Temp Fix */
|
||||
.wp-block-jetpack-mailchimp input[type="email"] {
|
||||
width: 100%;
|
||||
|
|
|
@ -3844,7 +3844,7 @@ body.page .main-navigation {
|
|||
}
|
||||
|
||||
.entry .entry-content .wp-block-image {
|
||||
max-width: 1000%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.entry .entry-content .wp-block-image img {
|
||||
|
@ -3917,7 +3917,7 @@ body.page .main-navigation {
|
|||
.entry .entry-content .wp-block-cover .wp-block-cover-text,
|
||||
.entry .entry-content .wp-block-cover h2 {
|
||||
font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
|
||||
font-size: 2.25em;
|
||||
font-size: 1.6875em;
|
||||
font-weight: 700;
|
||||
line-height: 1.25;
|
||||
padding: 0;
|
||||
|
|
|
@ -3855,41 +3855,14 @@ body.page .main-navigation {
|
|||
}
|
||||
}
|
||||
|
||||
.entry .entry-content .wp-block-image {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.entry .entry-content .wp-block-image img {
|
||||
display: block;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.entry .entry-content .wp-block-image .aligncenter {
|
||||
max-width: calc(8 * (100vw / 12) - 28px);
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1168px) {
|
||||
.entry .entry-content .wp-block-image .aligncenter {
|
||||
max-width: calc(6 * (100vw / 12) - 28px);
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.entry .entry-content .wp-block-image .aligncenter {
|
||||
margin: 0;
|
||||
width: calc(8 * (100vw / 12) - 28px);
|
||||
}
|
||||
.entry .entry-content .wp-block-image .aligncenter img {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 1168px) {
|
||||
.entry .entry-content .wp-block-image .aligncenter {
|
||||
width: calc(6 * (100vw / 12) - 28px);
|
||||
}
|
||||
.entry .entry-content .wp-block-image .aligncenter img {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
.entry .entry-content .wp-block-image.alignfull img {
|
||||
width: 100vw;
|
||||
max-width: calc( 100% + (2 * 1rem));
|
||||
|
|
Loading…
Reference in a new issue