Header broken and issues in IE, Edge and Mobile Safari
This support request was posted in Smart by Smokingone
- Smokingone September 23, 2017 at 4:47 pm
Hi there,
I was just testing this site and on Internet Explorer 11 and MS Edge, the header is very buggy.
On Mobile Safari on iPhone 6, the hamburger menu is out of place and not aligned.
On MS Edge:1) The shrinking animation is glitching severely on all pages as I scroll up and down
2) Company Logo is 95% disappeared
On Internet Explorer:
1) Company Logo is 95% disappeared
2) The header shrinking is not correct on home page versus all the other pages – it shrinks more on home page than it does on the other pages.
3) the page load animation is not rendering correctly
I believe that the issue is that Edge and Internet Explorer are struggling to render the transparent header on home page. – (I have raised in another ticket that I would like the option to switch transparency off on the home page header in any case)
This looks like a bug in the theme code? as this issue is present in both Internet Explorer and Edge, even using the preview version of “Business Modern” on Themeforest.
https://themeforest.net/item/smart-responsive-multipurpose-wordpress-theme/17333318?s_rank=1Could you please assist me with a fix as corporate users in particular may still use Internet Explorer and Edge and its important the page displays correctly to them?
Equally I would like the site to render properly on Mobile Safari..
ThanksSmokingone September 23, 2017 at 11:25 pmAnother render issue:
I also noticed in both Edge and Internet Explorer, the rendering of “Subheader separator” (WPBakery Page Builder > Insert “Heading” Module > Subheading > Separator) is not as I want –
In chrome and Firefox the separator is displayed left aligned as I like.On IE and Edge, it renders almost centre aligned and makes website look broken.
Please can you assist? Hopefully this can be fixed on the theme side…
Thankfully I dont see any other issues on IE or Edge.
FWIW IE and Edge both render http://www.zerotoonebook.com home page header perfectly just like on Chrome, with transparency etc with no issues so the browsers are certainly capable of doing so.
Hoping you can provide a fix soon!
Thanks
Andrés Villarreal September 25, 2017 at 4:26 pmHi,
Thank you for writing, I hope you’re doing well.
We just added some CSS to fix most of these issues to your theme options, under Design & Styles > Custom Styles & Scripts. You can see the code here:
That code fixes the following issues:
- Hamburger menu alignment in Safari Mobile.
- Jumpy shrinking animation in MS Edge.
- Jumpy fixed header on both MS Edge and Internet Explorer.
- Heading separator alignment on both MS Edge and Internet Explorer.
You can remove the comments if you want. These same fixes are gonna be included in the next release of Smart.
However, there are a couple issues that are not fixed yet:
- Company Logo is 95% disappeared: You are using an SVG image as your company logo. Both Internet Explorer and MS Edge are known to have rendering issues with SVG files, and this particular file looks that way in both browsers even if you access the image directly: https://ensynia.net/wp-content/uploads/2017/09/Enslogo-Dark-background-6.svg. We recommend using a PNG file for your logo instead.
- The page load animation is not rendering correctly: The spinning page loader uses an SVG animation. Since IE is not fully compatible with all SVG features, this animation doesn’t look exactly as it looks in other browsers, but it does look as it’s supposed to in IE. We’re currently working on a workaround for this behavior, but in the meantime, maybe you’ll want to check the other page loading options available?
I hope this helps. Please let us know how it goes.
Best,
Andrés.
Smokingone September 26, 2017 at 12:16 amHi,
Thank you very much guys for the quick fix – I confirm its all working now.
I changed the logo to PNG and its displaying correctly now on all the platforms.
Thanks also for the other fixes.
Impressed with how quick you guys work and will definitely be writing a great review!
Cheers
Smokingone September 29, 2017 at 3:13 pmHi quick question on this –
received an update the other day to 1.0.2.4
Can i remove the CSS fixes from the “extra CSS” fields?Happy for this issue to be closed otherwised!
Thanks
Juanfra Aldasoro September 29, 2017 at 3:23 pmHi There,
Thanks for the follow-up and the kind words. We’re always happy to get feedback and we love good reviews. They are really important for independent developers like us.
Yes, you can remove those if you updated to 1.0.2.4 🙂 If something comes up, you can come to this ticket and check the code again.
Have a nice day,
Juan.
This topic is marked as resolved
Only the topic author can re-open this thread.