Text alignment under pictures not matching.

grammaticirony · Member · Jun 13, 2019 at 12:28 pm
Copy link

Add topic to favorites
The text under pictures, even those I align to the centre, has started aligning to the left.

Compare before: https://worldwriting.home.blog/2019/05/04/grammar-matters/

And after: https://worldwriting.home.blog/2019/06/08/writing-fantasy-hammer/

I have not been doing anything differently, and I cannot see any problems with the code (although I am not entirely sure for what it is that I would be looking), but it is really winding me up and looks sloppy. Does anyone know how to fix this? I have tried looking through the forums and there seem to be various text alignment issues, but none quite like this. Sorry if I’ve missed something obvious.

The blog I need help with is: (visible only to logged in users)
staff-zinnia · Staff · Jun 13, 2019 at 2:22 pm
Copy link
Are you adding these as “captions” from the media settings?

A potential work around would be using the new block style editor. Add a new text block underneath each image with your “caption” and format the text accordingly.
grammaticirony · Member · Jun 13, 2019 at 5:02 pm
Copy link
Not as far as I know. Where would I find out either way?

I will try your suggestion for now.
supernovia · Staff · Jun 13, 2019 at 5:21 pm
Copy link
Thanks, if you need more help, please send a link to an affected post and we’ll take a look.
grammaticirony · Member · Jun 13, 2019 at 5:27 pm
Copy link
Although lizkarkoski has suggested a way to work around the problem, the problem is persisting.

Writing Fantasy-hammer

As you can see, the caption text is justified, even though the picture is aligned to the centre. In older posts, the text sits centralized underneath the picture to which it is attached.

Grammar Matters
staff-blorbo · Staff · Jun 13, 2019 at 6:13 pm
Copy link
This definitely should not have changed recently.

Are you doing anything different with regards to uploading and/or adding media to your posts?
grammaticirony · Member · Jun 13, 2019 at 7:15 pm
Copy link
Not as far as I can tell, and the text still sits in the centre when I’m composing the post. It also seems to happen regardless of whether I upload the image to media or simply copy and paste from somewhere.

I could upload a screenshot of an afflicted area as it appears on my own screen when composing and the same area according to the code, but I don’t know how to do that here either.
supernovia · Staff · Jun 13, 2019 at 9:41 pm
Copy link
As you can see, the caption text is justified, even though the picture is aligned to the centre.

The captions I’m seeing are center aligned…

Do you see different things in different browsers?
grammaticirony · Member · Jun 13, 2019 at 10:20 pm
Copy link
Interesting! I tried opening that particular blog on Chrome instead of Edge and, as you say, it does all appear to be correctly aligned. However, the captions in the preview for the post I am preparing for Saturday are still incorrectly justified even in Chrome.

I shall wait and see whether or not it posts correctly on Saturday morning and update as necessary then, if that’s all right.
supernovia · Staff · Jun 13, 2019 at 10:55 pm
Copy link
Sure, or we can preview too if you’d like to save your draft.
grammaticirony · Member · Jun 14, 2019 at 6:56 am
Copy link
How do I share a saved draft or preview? Sorry I’m such a Luddite, and thanks for all this help.
kokkieh · Staff · Jun 14, 2019 at 7:02 am
Copy link
Just tell us the title of your draft post, and we can view it in your site’s dashboard.
grammaticirony · Member · Jun 14, 2019 at 10:44 am
Copy link
It’s called ‘Writing 40,000 Hammers’.
gemmacevans · Staff · Jun 14, 2019 at 2:50 pm
Copy link
Hi grammaticirony,

However, the captions in the preview for the post I am preparing for Saturday are still incorrectly justified even in Chrome.

Thanks — I’ve done some testing and I’ve been replicate this using Chome (Mac). The caption appears centre aligned in the editor but left aligned in the preview and published post. These are the steps I worked through:
1. Go to My Site > Site > Posts > Add new
2. Click + and select an image block
3. Upload or choose an image from the Media Library
4. Add a caption
5. Click “Preview”
Are these the exact steps you are following too?
grammaticirony · Member · Jun 14, 2019 at 3:10 pm
Copy link
Yes indeed.
staff-blorbo · Staff · Jun 14, 2019 at 6:46 pm
Copy link
Interesting, so I’m trying this myself and still can’t reproduce the problem following this steps.

It works fine for me under Firefox 67.0.2 (Mac) and Chrome 75.0.3770.90 (Mac).

Which version of Chrome are you running?
garysixtyeight · Member · Jun 14, 2019 at 7:26 pm
Copy link
I’ve done some testing and I’ve been replicate this using Chome (Mac). The caption appears centre aligned in the editor but left aligned in the preview and published post.

I can reproduce it too.

The CSS rule below is being applied in the block editor iframe to centre the caption, but that isn’t loaded on the front end of the site or the preview.
```
.wp-block-embed figcaption, .wp-block-image figcaption {
    color: #555d66;
    font-size: 13px;
    text-align: center;
}
```
grammaticirony · Member · Jun 14, 2019 at 7:53 pm
Copy link
I’m using Chrome version 74.0.3729.169 and Edge version 44.17763.1.0 .
supernovia · Staff · Jun 14, 2019 at 9:09 pm
Copy link
I’m on Chrome 75.0.3770.80, awaiting an update. Writing 40,000 Hammers appears centered here. I’ll try updating Chrome to see what happens then.
supernovia · Staff · Jun 14, 2019 at 9:50 pm
Copy link
Now on 75.0.3770.90 — I still see consistently centered captions on Chrome, as well as in Firefox.

No items found.