data-align="center" does not work

Changes are made on on 11.x (our main development branch) first, and are then back ported as needed according to our policies.

i am not able to reproduce the issue.
Can you please update this issue with more detailed steps to reproduce and screenshots.

1. I Click on the IMCE button (fig. 1).
2. I Select the image (fig. 2).
3. I Select "align center" (fig. 3).
4. Check the source code (fig. 4).
5. I Save.
6. The image is aligned to the left (fig. 5).

Is data-align="center" present in the rendered page markup? Which theme are you using?

I use the Solo theme, but I've always had this problem with other themes and other versions of Drupal.
https://prova.gmpe.it/prove

Would you please answer both of my questions?

Sorry, but I don't understand English well and I have to use Google translate.
1. I answered: I use the Solo theme https://www.drupal.org/project/solo →
2. I'm not very experienced and I don't know what to look at. the test page is this: https://prova.gmpe.it/prove

Thanks and best regards

Look at the page source to see the HTML. Anyway class="text-align-center" is on images so I think this is more to do with themes than with CKEditor or with that web site's text filters configurations.

In the page source there is class="align-center" and "align-right": center does not work, right works.

I will try to contact the theme author, but I don't think this is the problem because it occurs with all the themes I use.
I usually align images in another way, but this problem is related to this other one: https://www.drupal.org/project/drupal/issues/3489646 🐛 CKEditor 5 moves some classes in the a tag Active

One or the other must be solved, unless a Drupal version of Colorbox-inline arrives.

Thanks and best regards

The author of the Solo theme, provided me with some css to add to my custom theme.
Now it works perfectly.

Kind regards

I'm having the same issue on this. It appears to only be when an image is added with the centre style. If the image has a caption, the styling works fine. So im wondering if its the figure/article styling.
This code below works:

<figure role="group" class="caption caption-drupal-media align-center">
  <article class="media media--type-image media--view-mode-full-width">
    <div class="field field--name-field-media-image field--type-image field--label-visually_hidden">
      <div class="field__label visually-hidden">Image</div>
      <div class="field__item">
        <img loading="lazy" src="<A URL>/857-630x200.jpg?itok=Fb7MC4Ym" width="630" height="200" alt="test" class="image-style-full-width">
      </div>
    </div>
  </article>
  <figcaption>Caption option</figcaption>
</figure>

This code below does not work:

<article class="align-center media media--type-image media--view-mode-full-width">      
  <div class="field field--name-field-media-image field--type-image field--label-visually_hidden">
    <div class="field__label visually-hidden">Image</div>
    <div class="field__item">
      <img loading="lazy" src="<A URL>/857-630x200.jpg?itok=Fb7MC4Ym" width="630" height="200" alt="test" class="image-style-full-width">
    </div>
  </div>
</article>

This is using the Gin 8.x-3.0-rc16 & ckeditor5 11.1.1

On my theme I applied this css, but I don't know if it works on yours too:

.field--type-text-long img:not(img.align-center),
.field--type-text-long video:not(video.align-center),
.field--type-text-long embed:not(embed.align-center),
.field--type-text-long object:not(object.align-center),
.field--type-text-with-summary img:not(img.align-center),
.field--type-text-with-summary video:not(video.align-center),
.field--type-text-with-summary embed:not(embed.align-center),
.field--type-text-with-summary object:not(object.align-center) {
   display: inline-block;
}