asset-share-commons icon indicating copy to clipboard operation
asset-share-commons copied to clipboard

Published 20 hours ago • verified publisher icon adobe

Some CSS styles are not supported in the Internet Explorer browser

Open ar80001-BRONGA opened this issue 7 years ago • 8 comments

The object-fit and object-position CSS styles used to render assets within the asset share page and on the asset details page are not supported in the Internet Explorer browser, and as a result assets are stretched horizontally within this browser, negatively impacting the user experience.

ar80001-BRONGA avatar Dec 12 '17 01:12 ar80001-BRONGA

Do you have equivalent styles that are supported by the ie browsers? Thanks

davidjgonzalez avatar Dec 12 '17 02:12 davidjgonzalez

I'll investigate an alternative CSS solution and report back on this issue. Thanks for the quick response!

ar80001-BRONGA avatar Dec 12 '17 02:12 ar80001-BRONGA

any update on this one? It's effecting us as well...

harincar avatar Mar 07 '18 19:03 harincar

@harincar do you have suggestions on how to adjust the css on how to achieve Modern cross-browser support? Unfortunately I don’t have IE to investigate.

davidjgonzalez avatar Mar 07 '18 21:03 davidjgonzalez

Has anyone tried to open asset-share-commons page within editor mode over IE? An error is thrown that it can not be opened in iframe.. Anyone has the same problem?

ppetrac avatar Aug 02 '18 09:08 ppetrac

@artdirk did you manage to progress at all with this?

josephrignanese avatar Aug 14 '18 03:08 josephrignanese

@josephrignanese, I unfortunately have not yet made any progress with this. The audience for the first team that went live with an Asset Share doesn't use IE, so we've been able to defer work on this for now.

ar80001-BRONGA avatar Aug 31 '18 22:08 ar80001-BRONGA

Hi @davidjgonzalez and @josephrignanese, I did some research on this and discovered the following:

  • As of 10/18/2017, object-fit is supported in Edge 16
  • If the image is specified via the background-image CSS rather than via the image's src attribute, the following code works in IE (it also worked in Firefox when I tested it):

<img class="cmp-image--card" style='background-position: center; background-image: url("/content/dam/old-navy/imagery/selects/2018/spring/0305_Block_SpringBreak/Spr18253_0305_BabyMoon_Mat/Retouched/Spr18253_0305_BabyMoon_Mat_01_v0597_d2.psd/_jcr_content/renditions/cq5dam.thumbnail.319.319.png"); background-repeat: no-repeat; background-size: contain;'>

If people cannot easily update IE for their employees or customers, updating the core Asset Share Commons code to set the image as a background image and apply the above styles to the .card.ui .image img class definition looks like it solves the IE problem.

However, I'm not sure if this will introduce other changes or issues because there may be other code that keys off of the image's src attribute.

ar80001-BRONGA avatar Aug 31 '18 23:08 ar80001-BRONGA