How do you get words to show up at the bottom instead of beside a left-aligned photo? [closed]

by

I blog about books via WordPress, so when I post book reviews, I have a photo of the cover beside the book details. When viewed on my desktop, everything looks fine, but when I view reviews on my phone, the words are clipped because they’re still beside the cover, rather than below.

How can I make the words show up below instead if they no longer fit in a small screen resolution, but still show up beside the image if they can?

My blog can be found here.

Thanks so much for your help. 🙂

1 Answer
1

You could turn off the alignleft floating for images when on mobile:

Add this to your style.css:

@media screen and (max-width: 480px) {
  img.alignleft {
    float: none;
  }
}

Basically it’s saying if the screen is less than 480 px wide, remove float left (ie no float) from images that are aligned left. It leaves them on their own line.

Leave a Comment