-
Notifications
You must be signed in to change notification settings - Fork 4.6k
Description
Description
Alignment of Image blocks appears inconsistent.
In a block theme (e.g. Twenty Twenty-Four), create a page and in it create an Image block, with "Align left" (or right). I expect the image block to align to the left (or right) of the content width.
What happens: the image may align not to content width but may float to the edge of the container.
The setting of “Inner blocks use content width” in the innermost enclosing block appears to be irrelevant. But if any outer enclosing block has this setting "on" (checked), then the image block aligns to the edge of the content width. If no outer enclosing block has “Inner blocks use content width” set on then the image block aligns to the edge of the container, irrespective of the setting in the innermost enclosing block.
This behavour occurs only with alignment "Align left" or "Align right". With default alignment (none) the image aligns with the content block width, as expected.
Is this right: the Image block alignment with "Align left" or "Align right" ignores the “Inner blocks use content width” setting of the innermost enclosing block?
Apologies if I'm reporting expected behaviour, but I haven't found this documented anywhere.
For an example, see https://simongarrett.uk/tt4/image-alignment-test/
Step-by-step reproduction instructions
- Create a page in Twenty Twenty-Four using the Pages template
- Include an Image block with "Align left" alignment
- (The innermost containing block is the Pages template's Content block, which has “Inner blocks use content width” set on. There is an outer Group block with “Inner blocks use content width” set off.)
- The image will float to the left of the container, not the left of the content width as expected
- It appears to ignore the “Inner blocks use content width” setting of the innermost containing block and use the "off" setting of the outer enclosing block.
Screenshots, screen recording, code snippet
See https://simongarrett.uk/tt4/image-alignment-test/ for an example.
Environment info
WP 6.5.4
Twenty Twenty-Four v1.1
Behaviour appears browser-independent (I've tried Firefox, MS Edge, Vivaldi)
Behaviour appears OS independent (I've tried Windows 10, Kubuntu 24.04)
Please confirm that you have searched existing issues in the repo.
Yes
Please confirm that you have tested with all plugins deactivated except Gutenberg.
Yes