Hi,
I want to make sure we’re looking at the right block. The markup you shared (wp-block-image, wp-image-…, wp-element-caption, <figcaption>) is the WordPress core Image block, not the GenerateBlocks Image block — our block renders a gb-media-… class and doesn’t produce that figure/caption structure.
Could you confirm which block is actually going blank in the Safari editor? If you inspect the affected <img> and it carries wp-block-image / wp-image-…, it’s the core block, and this would be a WordPress core rendering issue rather than something in GenerateBlocks. If it’s genuinely our Image block (a gb-media-… class on the <img>), send me that element’s full class list from the editor DOM and I’ll dig in — but from the plugin source, our <img> doesn’t receive the wp-block class that would trigger the content: "" rule you identified.
Hi,
I think there might be a mix-up — I never mentioned wp-block-image, wp-image-…, wp-element-caption, or a <figcaption>anywhere. I’m definitely talking about the GB Image block.
For clarity, here’s the DOM structure dump from the Safari’s inspector (I manually removed the domain name from the URLs in code samples before posting):
<a>
<img tabindex="0" draggable="true" class="block-editor-block-list__block wp-block gb-media-eb991c9f wp-block-generateblocks-media" src="/wp-content/uploads/2026/08/test.jpg" alt="" title="The third highest truth I" data-gb-id="eb991c9f" data-context-post-id="1081" id="block-1855fba4-a525-436d-82e4-0e20eb642690" role="document" aria-label="Blok: Image" data-block="1855fba4-a525-436d-82e4-0e20eb642690" data-type="generateblocks/media" data-title="Image" width="2048" height="1536">
</a>
And here is the Page source code from Gutenberg editor:
<!-- wp:generateblocks/media {"uniqueId":"eb991c9f","tagName":"img","styles":{"width":"100%","height":"auto"},"css":".gb-media-eb991c9f{height:auto;width:100%}","htmlAttributes":{"src":"/uploads/2026/08/test.jpg","alt":"","title":"The third highest truth I"},"mediaId":1082,"linkHtmlAttributes":{"href":"/uploads/2026/08/test.jpg"}} -->
<a href="/wp-content/uploads/2026/08/test.jpg"><img class="gb-media-eb991c9f" src="/wp-content/uploads/2026/08/test.jpg" alt="" title="The third highest truth I"/></a>
<!-- /wp:generateblocks/media -->
So the wp-block class is present alongside your own gb-media-… class and it adds the content: ""rule and blanks the image in Safari. As I mentioned in my first post, it seems that adding the wp-block class was introduced in recent updates.
Regards,
Michal
It works, thank you! I didn’t realize that the problematic css rule was from WooCommerce and not from WordPress core.
