images not aligning
-
Images added to text appear correct in preview but are not aligning properly on actual webpage.
The blog I need help with is: (visible only to logged in users)
-
re: image alignment
Align-left means position left, with the rest of the content wrapping around the right side of the image.Align-right means position right, with the rest of the content wrapping around the left side of the image.
Align-center means position center, with no wrap-around (= the rest of the content below the image).
If the text beside the images does not occupy the same amount of space that the image beside it does then the text wrapping will continue and the images and text that follow will have a staggered appearance.
To prevent the staggered effect what you do is insert the following snippet of code into the Text (HTML) editor after each image/text pair:
<div style="clear:both;"></div>See: https://en.support.wordpress.com/visual-editor/
Alignment
Align Left https://en.support.wordpress.com/visual-editor/#alignment
Align Center https://en.support.wordpress.com/visual-editor/#alignment
Align Right https://en.support.wordpress.com/visual-editor/#alignment -
Thank you for your reply time thief. I understand alignment and text wrapping. That’s not the problem here. If I use a full size photo, or I align centre, all is well. But if I use a smaller photo and try to align right or left, then the caption appears outside the margins beside the photo rather than under it. If I play with changing the size of the photo or moving it around in an effort to fix this, then it ends up outside the margins itself or overlapping the text. This only happens on full size view. All is well in preview, tablet and mobile views.
-
Hello,
It’s difficult to help you with your website if you make it private. We can’t see what’s going on or look into the code.
Let us know if you choose to make it public so we can see what’s happening and offer a solution.
Thanks,
arlen -
Hi Arlen,
Thank you for your reply. The site is far from ready to go public, but I understand that you can contact me and ask for permission to view as a registered WordPress user. If you do that I will gladly agree.
-
Volunteers cannot view private blogs and we Volunteers do not request access to them. Staff can view private blog content and this thread is tagged for their assistance. Please be patient while waiting for a response and subscribe to this thread so you are notified when they respond. To subscribe look in the sidebar of this thread, find the subscribe to topics link and click it.
-
Hi there,
Can you please give me a link to a specific post or page where this is happening?
But if I use a smaller photo and try to align right or left, then the caption appears outside the margins beside the photo rather than under it. If I play with changing the size of the photo or moving it around in an effort to fix this, then it ends up outside the margins itself or overlapping the text.
Captioned images can’t be moved, as the captions don’t move along with them. This is a known issue with image captions. Please try removing the captioned images, then add them back without any captions. Resize and position them the way you want, and only add the captions as the last step.
Let me know if it still displays incorrectly if you use this method, and please remember to include a link to the post/page in question so I can take a look. I’ll be able to see the post, but that link won’t work for anyone else in the forums.
-
timethief, thank you for your input.
kokkieh, here’s a link to one of the problem pages – https://upslackpublications.wordpress.com/index/facts-and-questions/
Just now, as you suggested, I have deleted both images, reinserted them, aligned them left and right respectively, and finally added the captions. You will see the results. Before I did this, the images were both correctly positioned with only the captions askew.
-
Thanks for the link. This is happening because of the way your theme treats captions. Your theme is designed to show image captions for left and right-aligned images next to the image instead of below them on wider screens. You can see the same behaviour on the theme demo here:
https://affinitydemo.wordpress.com/image-alignment-and-styles/
On your page it’s appearing over the image, though, and that is due to the span-tag that you’re using to change the colour. If you use a div-tag to change the colour instead, it displays the caption next to the image as the theme intends on wider screens, and below on smaller screens.
-
Understood. Many thanks. Good to know that it’s as intended. I don’t really like the look though. I suppose I could try different themes, but before I do, is there any quick (and easy for dummies) way of changing the default settings – tweaking the CSS in some way maybe?
-
It should be possible to override the caption behaviour using CSS. The experts in our CSS forum will be able to help you with the code you’d need, but you’ll also need to have the Premium or Business Plan on your site in order to make CSS changes.
-
-
<span style=”color: 
- The topic ‘images not aligning’ is closed to new replies.
WordPress.com Forums 