Pro 3.0 - Background images not working on IE11 (Internet Explorer)

Support
#1

Background images not working on IE11 (Internet Explorer) plus other IE11 formatting issues.

On pages created using Pro 3.0, background images do not display when viewed on IE11. Please view these pages on IE11 to see what I’m talking about:


As you can see, where the background images should be, you see just see white-colored backgrounds. View the above pages on Chrome or Firefox to compare.

There is another issue where image assets on the page are not adhering to max-width limits when viewed on IE11. You can see this with the Header logo image; it is way too big compared to how it’s viewed on other browsers.

There was another IE11 issue as well where image assets were not adhering to 100% max-widths causing images to overlap with next. To remedy, I did some research within your support group and found a post from one of your techs recommending I use the CSS below. This did fix the issue but wondering if it could have created the other issue directly above?

@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
.x-face-graphic img,
.x-image img {
width: 100% !important;
}

Any help you can provide will be greatly appreciated. My client’s primary browser is IE11 so absolutely need to find solutions to these issues. Thanks so much ! Brad

#2

Hi @bradmaclean,

Sorry that you’re having that issue, I can confirm this bug where the background-image is not visible when the parallax effect is enabled. You can turn off the parallax effect for now, I’ve submitted this to our issue tracker so the developers will be made aware of it.

Thanks,

#4

Hi @friech,

Thanks for the quick response and confirming the bug. Is this somethign that will be fixed in an upcoming spot release? I have 5 websites upgraded to 3.0 all with a bunch of pages with a bunch of sections using parallax background imagery. Hate to have to go into every site on every page and every section to disable parallax . If you can get this fixed in next spot release then I’ll probably wait. Can you find out whether this will be made a priority? Thanks!
Brad

#5

Hi Brad,

Sorry, but we can’t provide an ETA of the next update, but rest assured our Dev Team is now into this. For the meantime you can add the custom CSS below on Theme Options > CSS as temporary fix for IE.

@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {  
	[class^='x-bg'][data-x-params*='parallax'] {
		opacity: 1;
	}
}

You can check our changelog page when we release an update to see if an official fix is included.

Thanks,

#6

Thx @friech; the temp fix worked for me. I will monitor the changelog.

Best,
Brad

#7

Hi Brad,

I just wanted to let you know we’ve pushed a fix to automatic updates to address this. Let us know if that works for you!

#8

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.