PRO - Header & Footer Builder Flexbox IE<11 Workarounds?

Hey guys!

Let me start by saying that for a couple of years now X has significantly sped up my development and Wordpress implementation process a hundredfold. I can’t thank you guys enough.

With the introduction of PRO, I jumped right in and started developing new sites using it. However, recently I’ve hit a roadblock and I just need some clarification as to any suggested fix or if I just need to approach theme customizing differently from here on out or go back to using X.

From my understanding, the Header and Footer Builders in PRO rely heavily on FlexBox. While this is supported in Chrome, Firefox, and Safari…it has limited support in IE11 and almost none in anything earlier than IE11.

This results in Headers and Footers looking really bad in IE. I’m not a fan of IE. And I hate it that some of my clients prefer it (only because it’s on their computer by default). However, is there some kind of fallback that you suggest? Or is there a way to disable FlexBox and use styling that is compatible with IE < 11?

I’ve noticed the same problem on almost all PRO websites that are shared in the PRO Showcase in this forum.

Here are three of my sites that I’m having this problem with (please note the headers and footers). If possible, please view them in Chrome and IE11 and IE10.

Thank you so much for all your hard work and support.

Freddy

Hey Freddy,

There is no problem with http://valleyfirm.kmclient.com on my end in IE11 except for the side submenu display which is a known issue and currently does not have a solution.

The other two sites are fine too except for the enlarged logo image.

It looks like you’re using the Standard image setup? Please try Scaling with Retina & Dimensions enabled.

If you want to continue with the Standard setup, you must set a specific size for the width.

For the footer in http://bro.kmclient.com, try setting the first container’s Flex Layout > Layout to Row and Self Flex to No Shrink. Then for the second container, try adding a left margin to your Social Icon. It looks like this in IE 11 with that settings.

Pro supports IE 11 and Edge only for Microsoft browsers. IE 10 and below are not supported.

Thanks.

1 Like

Thanks for the clarification.

You’re welcome.