Archived topic
Center align images for mobile and not desktop
1 reply · Started by Daniel on December 6, 2021
Hey Guys, for every article on my site I right align the first image on desktop. Howver on mobile the image gets messed up and doesn’t allign correctly.
Is there a way I can automatically allign my images on mobile to the center? when I allign my images to the center they also allign center on the desktop.
Main problem is I have 300+ articles with this image issue on android mobile phones. It’s weird because when I check on my iphone the image is center aligned normally.
So I need to fix this issue for android users coming to my website.
Here are some examples of the article
Hi there,
try this CSS:
@media(max-width: 500px) {
.site-content .wp-block-image figure {
float: none;
text-align: center;
margin: 0;
width: 100%;
}
.site-content .wp-block-image figure img {
width: 100%;
}
}
Adjust the @media max-width 500px to suit when you want it to center.