Docs

[brightgreenpath]

Hi, I’ve spent a lot of time trying to clean up some image problems with X Renew in Internet Explorer. Hope you can help.
1) I’ve given my logo a width for auto scaling. It’s working fine in all browsers except for IE11 where it’s ragged.
2) For Essential Grid, once items load in any view, the overlay is very blurry. In developer tools if I disable “Transform” they look fine. Is there a CSS snippet to permanently disable ‘transform’ only in IE?
I’ve reset my IE to everything default (as users would see).
Please see [http://brightgreenpath.com/web-design-specials-packages/] in IE11 for examples of both renderings.
Thanks much!
Stacy

[Rad]

Hi there,

Thanks for writing in.

1. Logo looks okay on my end. It has 196.5px width, which is the same on chrome.

2. Please add this CSS to Admin > Appearance > Customizer > Custom > CSS

_:-ms-input-placeholder, :root .esg-overflowtrick ul li.eg-ulysses-s-grant-wrapper  {
transform: none !important;
}

Cheers!

[brightgreenpath]

Hi there, and thanks!

1. I went ahead and just sized my logo; removed width for now, so you may not have noticed that problem. I can put the original logo and settings back if you’d like.
2. Also, I added the CSS in customizer, refreshed the page, but it’s still showing very blurry on both essential grids. Specials/Portfolio.
I’m not using caching right now…

[Joao]

Hi There,

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks

Joao

[brightgreenpath]

This reply has been marked as private.

[brightgreenpath]

I just confirmed that the latest Edge browser in Windows 10 has the same problem unfortunately.

[Rad]

Hi there,

You should properly close your @media block, else, other CSS under it will not work.

@media (max-width: 979px) {
.x-column.x-md {
    float: left;
}_:-ms-input-placeholder, :root .esg-overflowtrick ul li.eg-ulysses-s-grant-wrapper  {
transform: none !important;
}

Should be like this,

@media (max-width: 979px) { //opening here
.x-column.x-md {
    float: left;
}
} //closing here

_:-ms-input-placeholder, :root .esg-overflowtrick ul li.eg-ulysses-s-grant-wrapper  {
transform: none !important;
}

Hope this helps.

[Lely]

Hi There,

Thank you for the credentials.
Can you try this CSS instead:

.esg-grid .mainul li.eg-ulysses-s-grant-wrapper{
 -webkit-transform:none !important;
}

See this testing on IE 11:http://screencast-o-matic.com/watch/cD10n6i0pQ

Hope this helps.

[brightgreenpath]

Rad – that’s Rad – this worked when I tightened up the CSS – looks great now in IE11.
THANK YOU SO MUCH for your help!!
fyi- I tried the CSS from Lely but it didn’t work.
Thank you all for helping me out on this, you’re the BEST!

[Lely]

Hello There,

Glad that Rad’s suggestion fixed the issue.

Cheers!

[brightgreenpath]

On this same topic, I’m trying to stop my portfolio images (essential grid again) from being so blurry in IE11 also. When I disable ‘transform’ as above in developer tools, they stay blurry…
This page is here [http://brightgreenpath.com/website-design-portfolio/]
Thanks in advance for your help!
Stacy

[Rue Nel]

Hey Stacy,

The Blurry image may have been cause by a caching plugin (http://prntscr.com/bmutva). Are you using CloudFlare or may have installed a caching plugin like WordFence, W3 Total Cache and any other minification plugin, please keep in mind that after doing every updates, always remember to clear all caches when updating so that the code from the latest release is always in use. This will help you to avoid any potential errors.

Please let us know how it goes.

[brightgreenpath]

Hi, I’ve cleared my cache and they are still blurry only in IE11. It must have something to do with the ‘transform’ CSS, which we fixed for the Specials essential grid (see above thread). Might you suggest a CSS fix?
Thanks much,
Stacy

[brightgreenpath]

I’ve disabled the cache so you can see the current CSS.
Thanks again,
Stacy

[brightgreenpath]

It’s fixed now – tried the same CSS code you sent me for the specials grid for a different skin!

_:-ms-input-placeholder, :root .esg-overflowtrick ul li.eg-j-f-kennedy-wrapper {
transform: none !important;
}

Looks great in IE11 now.

[Author]

Posts