Centering image on mobile | WordPress.org

Resolved Joseph
(@xmsmmgrs)

5 years, 2 months ago

I have a small image which is right aligned. On mobile, there is some text on the left side of the image, which does not look good. I would like to have that image centered on mobile only. How can I do that? I tried lots of CSS codes but none worked.

Thanks!

Viewing 4 replies - 1 through 4 (of 4 total)

Moderator Steven Stern (sterndata)
(@sterndata)

Volunteer Forum Moderator

5 years, 2 months ago

Please provide a link to a page on your site where we can see this. Thanks.

Thread Starter Joseph
(@xmsmmgrs)

5 years, 2 months ago

http://bit.ly/2tdxBeT
Moderator Steven Stern (sterndata)
(@sterndata)

Volunteer Forum Moderator

5 years, 2 months ago
Try this. it centers the image and below 600px and then goes to the normal right-alignmnent at 600px.
```
img.alignright {
    float: none;
    margin: 0 auto;
}
@media screen and (min-width: 600px) {
   alignright {
    float: right;
    margin: 5px 0 10px 15px;
  }
}
```
To add or override CSS: use the “Additional CSS” option in the customizer. https://codex.wordpress.org/CSS#Custom_CSS_in_WordPress

Learn to use the Chrome Developer Tools to help you see and test changes to your CSS.
Thread Starter Joseph
(@xmsmmgrs)

5 years, 2 months ago
I added that code, but now it is centered on desktop too.

Later edit: never mind, when I opened my eyes I saw the problem. 🙂
```
img.alignright {
    float: none;
    margin: 0 auto;
}
@media screen and (min-width: 600px) {
   img.alignright {
    float: right;
    margin: 5px 0 10px 15px;
  }
}
```
- This reply was modified 5 years, 2 months ago by Joseph.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Centering image on mobile’ is closed to new replies.

In: Fixing WordPress
4 replies
2 participants
Last reply from: Joseph
Last activity: 5 years, 2 months ago
Status: resolved

Topics

Topics with no replies

Non-support topics

Resolved topics

Unresolved topics

All topics