Archived topic
Dispatch Theme GeneratePress Image fix on mobile
1 reply · Started by Wayne on April 15, 2021
Viewing posts 1–2 of 2
So on desktop, the dispatch theme looks absolutely beautiful.
But on mobile, the middle section of the theme looks terrible.
If you notice the screenshot, the image on mobile becomes a long rectangle. How do I fix this and make it look like a square or rectangle like the other pictures?
Hi there in Customizer > Additional CSS look for the following CSS rules:
@media (min-width: 420px) {
.wpsp-align .wp-show-posts-image {
margin-bottom: 0;
}
}
@media (min-width: 420px) {
.wpsp-align .wp-show-posts-inner {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.wpsp-align .wp-show-posts-inner>div {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
}
@media (max-width: 768px) and (min-width: 420px) {
.wpsp-align .wp-show-posts-inner .wp-show-posts-image {
margin-right: 1.5em;
}
}There are 3 instaces of min-width: 420px; - change each of them to a greater value - eg. 520px
This archived topic is closed to new replies.
