Image alignment problems

Home Forums Jevelin Theme Image alignment problems

Home Forums Jevelin Theme Image alignment problems

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    RESOLVED Posts
  • Tongalong
    Participant

    Hi Support Team,

     

    I’ve been trying to figure out how to align images height/center side by side using the Javelin theme.

     

    What happens is that the images are slightly off centered when previewing the blog page.  I’ve tried using custom css and tried manually editing the html to get images to align using display:inline-block, however images still show as off centered.  If I switch between visual/text it removes any custom css I’ve added. Note I’m using an external links to smugmug.

     

    Attached a screenshot so you can see images are slightly off centered even though in visual editor they are aligned.

    Attachments:
    You must be logged in to view attached files.

    Hi @Tongalong,

     

    I hope you are well today and thank you for your question.

     

    Are you talking about the misalignment as shown in the attached screenshot?

     

    Could you please share me the page URL from your site where it is displaying so that i can help you?

     

    Best regards,
    Shufflehound team

    Attachments:
    You must be logged in to view attached files.

    Tongalong
    Participant

    Here’s a sample of the picture side by side in here.

     

    https://www.heatherandkevin.me/rise-of-heather-and-kevins-travel-blog/

    Tongalong
    Participant

    So aligning left I think will wrap text around which I don’t want.  I’ve tried display inline block as suggested also but results in the changes removed when switching between visual and text editor.

    No it won’t wrap text around if you only left align first image.

    Tongalong
    Participant

    Thanks that seemed to work, however I see text wrapping around due to the responsiveness of the site.  If I shrink my browser down, you see the text wrap to the right of the image which throws it off.

     

    see: https://www.heatherandkevin.me/rise-of-heather-and-kevins-travel-blog/?preview_id=1331&preview_nonce=b56ee05a72&post_format=standard&_thumbnail_id=351&preview=true

     

     

    It seems this is happening because you are aligning both the images to the left instead you should only align left most image and not right image.

    Tongalong
    Participant

    Perfect thank you!  Sorry I’m not good with CSS clearly 🙂

     

    Sorry last question… is there an easy way to create a shortcake for that to add to an image?  I can add it, but incase someone less proficient with html/css doesn’t want to mess with it.  Is that an option?

    Solution for this topic

    I think you are talking about shortcodes.

     

    You can align images either using WordPress alignment classes or using visual editor as described in the following pages.

     

    https://en.support.wordpress.com/images/image-alignment/

    https://codex.wordpress.org/Wrapping_Text_Around_Images

     

    Tongalong
    Participant

    Great.  I think it’s all good now thanks!

    You are most welcome here 🙂

Viewing 12 posts - 1 through 12 (of 12 total)