Pro Header in Safari

[Misho]

Hi!

After some complaints from the Safari users, I have made a Lambda browser test of a page and it returns what users have described:

The issue is not present in Chrome/Firefox. Do you have any suggestion how to fix this?

The original URL is this: https://www.mojemalozlato.com/en/gluten-free-products/fruit-cake/

Thanks!

[tristup]

Hi @Misho,

Thanks for reaching out.
It seems the issue is with the height of your header bar, which is currently set to 2.5em(40px), there few probable solutions which can be used to overcome this problem.

1. Set header bar’s height to 5em instead of 2.5em
2. Change the header’s second container Self Flex option to Standard instead of Fill Space.
3. If Fill Space, won’t work, then try Custom with value 0 1 100%.

Alternatively, you can try by adding these into two separate header bars, and set height 2.5em to each of them.

Hope that helps
Thanks

[Misho]

Indeed! The 2.5 em height was set to make a long logo extend below the bar. Instead, I have absolutely positioned it and now the header is ok in Safari.

Safar is still annoying for interpreting design differently than other browsers.

Thanks!

[tristup]

Hi @Misho,

That’s great the Header issue is fixed now, regarding the styling issues you may need to add a few custom CSS code to adjust the style in Safari.

In this regard, I would suggest you hire a developer who can assist you to do the customization or you can avail of our newly launched service called One, where the customization questions are answered.

Thanks