Image Block: Caption with Link in Wide-Width and Full-Width Images Appears on Two Lines Instead of One Line

[lizswafford]

Quick summary

When a caption in an Image Block includes a link, and the image is set to either wide-width for full-width, the text and link in the caption are split up and shown on two lines.

When the Image Block is set to centered, the text and link appear on the same line.

Is this expected behavior for the Image Block? If so, is there an option in the toolbar or settings to remove the
when a link is used?

Steps to reproduce

1. On a site with a FSE theme, such as Byrne, go to the page or post editor.
2. Insert the Image Block and add an image.
3. Type in a caption such as "Photo Credit: Nature is Amazing Photo Collection".
4. Highlight the text "Nature is Amazing Photo Collection" and add a link.
5. Change the Image Block alignment to Wide-Width or Full-Width
6. Notice the the text is split into two lines: "Photo Credit: Nature is Amazing Photo Collection"
7. When inspecting the page, the HTML shows a
   tag is added.
8. Change the Image Block alignment to None
9. Notice that the text is not split and appears in one line: "Photo Credit: Nature is Amazing Photo Collection"

What you expected to happen

• I expect the text and link to appear in one line as it was typed in the editor regardless of the image width selected.
• Or have an option to toggle-off the line break
  .

What actually happened

• The user is not able to control the link placement.
• In the editor, it is not possible to delete the line return and show text and link on one line.
• When choosing the option to Edit as HTML the
  is not present.
• Available block styles apply only to the appearance of the image not the caption.
• There is no built-in option to edit appearance of captions. Such as an option in the Global Styles in the Editor.

Impact

Some (< 50%)

Available workarounds?

Yes, easy to implement

If the above answer is "Yes...", outline the workaround.

A workaround could be to add the Image Block, leave the Caption empty. Then, add a Paragraph Block below the Image Block.

Platform (Simple and/or Atomic)

Simple, Atomic

Logs or notes

(8928979-zd)

[github-actions[bot]]

Support References

This comment is automatically generated. Please do not edit it.

• [ ] 8928979-zen

[jartes]

📌 REPRODUCTION RESULTS

• Tested on Simple – Replicated
• Tested on Atomic – Replicated
• Replicable outside of Dotcom – Yes

📌 FINDINGS/SCREENSHOTS/VIDEO

• I was able to replicate using Playground on WordPress 6.7 and GB 19.7.0

📌 ACTIONS

• Triaged
• Opened a GB issue: https://github.com/WordPress/gutenberg/issues/67206
• Added to the CtD board, and pinged them on p1732205295571469-slack-C07H21B2W59
• Added the Core fix needed label