Archived topic
Centered Image not behaving on iPhone
7 replies · Started by Marcia on January 16, 2018
Oh my home page, there is a centered image that looks fine everywhere but on an iPhone. When I load that page in portrait, the large image is sort of flush right off the edge. When I switch to landscape, the whole page loads, but the image is teeny tiny and centered.
I'm sure it's something simple, but I'm baffled.
Hi there,
Instead of using margin here:
.entry-content>:last-child {
margin-left: 250px;
text-align: left;
margin-right: 250px;
color: #930026;
font-family: Tahoma,Geneva,sans-serif;
}
Try adding this:
.home .entry-content {
max-width: 500px;
margin: 0 auto;
}
I tried that and no image showed up at all in my mac's browser. I took out the extraneous coding from my original .entry-content coding and that didn't help either.
Do I need to add media queries or some such? A bit of a newbie here...
Cheers,
MG
Hmm Tom's solution should work however I still see the original CSS being added.
Can you remove it so we can see the result?
Okay. Just changed it to Tom's code and commented out the old. On my iMac screen here at work, there is no square image of someone holding a violin.
I still see this CSS being added:
.entry-content>:last-child {
margin-left: 250px;
text-align: left;
margin-right: 250px;
color: #930026;
font-family: Tahoma,Geneva,sans-serif;
}
Here is where the code is if you can't find it: https://s18.postimg.org/em6wlf9gp/2018-01-17_1741.png
That's it! Of course I have no idea how that coding was put in there, but as long as it works.
You guys are great and I can't thank you enough.
Cheers,
MG
Glad we could help!