Home › Forums › Jevelin Theme › Image alignment problems
Home › Forums › Jevelin Theme › Image alignment problems
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.
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
Here’s a sample of the picture side by side in here.
https://www.heatherandkevin.me/rise-of-heather-and-kevins-travel-blog/
You have to align your images to the left to display them side by side as described in the following pages.
https://enviragallery.com/how-to-show-wordpress-images-next-to-each-other/
https://premium.wpmudev.org/blog/finally-getting-images-to-sit-side-by-side-in-wordpress/
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.
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.
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
Great. I think it’s all good now thanks!
You are most welcome here 🙂