Support » Fixing WordPress » Words Break next to Featured image

  • I am building a Yoga Blog site http://thebodyistalking.com . It is fine on my desktop and tablets, but on the smallest (vertical phone) screens the featured image shows correctly on the left but the text to the right of that shows only one or 2 letters on each line. The words are breaking in the middle! After reading other forum posts I have deleted the content and replaced it with content that has been stripped of formatting, have switched to classic editor and pasted as text, and have even retyped the content to make sure there is no errant formatting, but the problem persists. Altering the size of the featured image does not change the word spacing either. On another phone the first 2 whole words appear next to the image (on 2 lines) and then the 3rd (longer) word starts the rest of the text below the image.

    Do you have ideas of what could be causing this and how I can fix it?

    Thank you.

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)
  • lisa

    (@contentiskey)

    ask the theme’s support team if they can suggest CSS fix or template function or other fix for smaller device display. https://weavertheme.com/
    maybe change the alignment of image from alignleft to alignnone when the display is in small device?
    maybe theme support team can suggest best css change to fill the available space 100%.

    • This reply was modified 1 month, 1 week ago by  lisa.
    Moderator Steve Stern

    (@sterndata)

    Support Team Volunteer

    Try this:

    img.featured-image.fi-post_full-content-top.fi-content-top.hide-none.fi-alignleft.wp-post-image {
        max-width: 50%;
    }

    You may have to add some @media overrides if you want it wider when the screen gets wide enough.

    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 or Firefox Developer Tools to help you see and test changes to your CSS.

    Thank you both. I will take it up with the theme support group, but, Steve, do you use the developer tools on your phone? I do all the time on my full screen but did not think even to look for them on the mobile screens. Where would I find them?

    Thanks again to both of you,
    Kimberly

    Moderator Steve Stern

    (@sterndata)

    Support Team Volunteer

    No, not on my phone. Use the phone simulator on mobile tools

    See https://i.imgur.com/W0riQ7w.png

    I did not know about that – Thanks!

Viewing 5 replies - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.