Hello.
I have a client website that is experiencing warping issue with logo in the navigation bar. It only occurs on internet explorer and no other browser platforms. I have added formatting and rules to ensure the warping doesn’t occur but it continues to happen. I have even moved the elements to a grid to avoid this but still have the issue.
Is there a way I can avoid changing the design dramatically and allow the design to show on Old versions oh IE?
Hi @SHAUN656, thanks for the post. I took a look at the home page in IE 11 the latest version of IE, but it appears the logo is not distorted from what I can see:
Is the issue still happening on your end?
I did notice a div block 10 class that has a white overlay showing on top of the menu, after removing that from the Navbar then then checking in IE, I get the result above.
Hello Dave,
I fixed the Menu Nav, but now there are issues with the overall layout on internet explore with elements not showing at all or showing completely distorted images below
I’m assuming this is the same Flex Box issue as the nav bar if this is the case is there any other element settings that do not function on Internet Explorer.
I understand that a small percentage of people use the Internet to explore, however, is there any movement to make flex box compatible with this explore? It is such a useful tool in Webflow but now I’m hesitant to use it due to the issues experienced with this client.
Going forward can you give any recommendations on how to center elements quickly rather than having to manually adjust Margins and Padding.
Thanks so much for reaching out and helping on this, it is greatly appreciated.
Here is a good read related to this subject.
If I need to build a site that supports IE and still takes advantage of modern CSS, I build it by hand.
Webflow does not provide native support for @supports at this time; so if you want to use it you need to write custom CSS.
Building custom costs me lots more time than cranking out a site in webflow. The client can make the choice if that support is worth the price I will charge.
As an alternative, you could just use your own elements with floats in webflow.
To determine what you can do and what you can’t for IE users leverage caniuse.com as a resource. You can also checkout the flex box bug list on github. GitHub - philipwalton/flexbugs: A community-curated list of flexbox issues and cross-browser workarounds for them.
Hi @SHAUN656, thanks for your reply, you asked:
however, is there any movement to make flex box compatible with this explore?
The answer to that is I think not as support for advanced CSS in the IE11 browser would have to be added by Microsoft, and they have made it clear that they have ended support for that browser.
I did some research and found some articles that may help:
CSS grid support for IE 11: Supporting CSS Grid in Internet Explorer | by Elad Shechter | Medium
Normalizing Flexbox bugs in IE: Normalizing Cross-browser Flexbox Bugs — Philip Walton
I hope that helps, I know working with IE can be tricky, @webdev correctly pointed out that you may have to check different resources like caniuse.com as a resource.
Great thanks for the links and advice.
