Browser: Safari 18.4
OS: macOS
URL: https://hauptwerkguru.com/shop
In Safari, the text and icon within the ‘Add to Cart’ button (Shortcode) are no longer vertically centered.
The button renders correctly in Brave:
and in LibreWolf:
Is there anything I can do to fix this issue?
Cheers,
Chris
Hi Chris,
Thanks so much for your report!
All good on my end, tested on three different devices in Safari (latest):
It probably makes sense to inspect the styles to see where the difference is, or if any style is being overwritten. Does the problem also occur in Gutenberg content? Have you already contacted surecart support?
Best regards,
timmse
Hi timmse,
Thank you very much for your prompt response!
Your findings prompted me to check whether the issue persists in a private Safari browser window. It does not — the text is vertically centered as expected. I then logged out of WordPress, and the issue was resolved there as well.
It seems the issue only occurs when I’m logged into WordPress. Interestingly, I hadn’t noticed this behavior before. The same effect is also present in both Brave and LibreWolf when logged into WordPress.
Best,
Chris
Okay, then it should be easy to spot the culprit by right-clicking » inspect on the button. Then, you can see which styles apply and where they are coming from.
@timmse. You can change the title to “NO BUG”.
Out of curiosity: What was the reason?
Hi @timmse,
As mentioned in my previous email, the issue was caused by the admin bar. The text within the button was offset vertically by the exact height of the admin bar. When viewing the website without the admin bar, the text aligns correctly within the button.
Cheers,
Chris
