Top Spacing Above Product Tabs in Gutenberg
-
Hi,
I have an issue with the spacing above the navigation tabs in a product block when using Gutenberg (WordPress 6.x, Woodmart theme).
On the frontend, the space between the section title and the tabs (“New / Top / Recommended”) is larger than what I see in the Gutenberg editor. In the editor it looks fine, but on the live page there is extra top gap.
Frontend screenshot:
https://snipboard.io/V1wo7e.jpg
In the editor:
https://snipboard.io/L2UIQf.jpg
Could you please help me with:
Which CSS declaration/class is adding this extra space (margin / padding / line-height etc.)?
How to fix it?
Thank you in advance!
Hello,
The extra spacing appears because each tab title contains two links — https://monosnap.ai/file/oBhE3znq0poiQDUNablde1xFRR0FMj
There are two links because you didn’t type the title manually in the editor — instead highlighted and copied the title from somewhere else, and it included a link, which you then pasted into Gutenberg.
The simplest solution is to recreate those tabs, but this time type the titles manually instead of copying them from somewhere along with the embedded link.
Kind Regards