Cross browser compatibility issues (formerly IE 11 display issues)

[matikin9]

Dependency

#1898

Overview

We need to have our website be consistent on all browsers including government issued browsers so that our stakeholders can see our site.

Action Items

• ask the research lead to put a link to this issue on Bonnie's agenda with Julien with the following note: ready for contact with ITA regarding browser usage
• Identify current browsers being used by city stakeholders Cross browser compatibility issues (formerly IE 11 display issues) #19 (comment)
• Test website against the browsers
• Determine what we will fix/change if anything

Original issue text

Some ahem government entities ahem are forced to use IE in their offices. It was brought to my attention that the page does not fail gracefully in IE 11. We should look into whether or not there is a simple fix.

[jjandoc]

Any screenshots? I imagine there's probably some CSS grid issues but I'm curious what else is going on.

[matikin9]

[jjandoc]

Totes McGotes CSS grid

[jjandoc]

Some background here for whoever wants to address this. The screenshots in question are broken due to IE11's implementation of CSS grid. Check caniuse.com shows that it should at least be partially supported with an -ms- vendor prefix. We're using the PostCSS autoprefixer to deal with autoprefixing. IE might have its own implementation and syntax that requires a bit more attention than autoprefixing is providing.

[ExperimentsInHonesty]

@matikin9 can you confirm that this is still an issue.

[matikin9]

Looks much better now, except there's a lack of space between the project cards. Also, not sure if this is intentional but the project cards are listed in a single column, as if for a mobile screen:

[abregorivas]

There are two major tools for cross-browser testing. However, there their trial versions are short and there may need to be a paid version that can be used across the organization.

• BrowserStack https://www.browserstack.com/
  -LambdaTest https://www.lambdatest.com/

[ExperimentsInHonesty]

This issue is being iceboxed until we finish this iteration of website and then we will run tests and figure out where we go from there.

[ExperimentsInHonesty]

This issue will come out of the icebox after the cut over and 24 hours for ISP cache clearing. ETA 5/14