Skip to main content
March 13, 2015
Question

Landing Pages Look Different In Internet Explorer/Chrome -- Problems with "Opaque Image

  • March 13, 2015
  • 3 replies
  • 1343 views
I built a landing page that looks great in Chrome, but is barely viewable in IE. Specifically, I used an "opaque" image with 10% opaqeness behind the text. In Chrome it looks great. In IE, the image is not opaque at all and appears as a normal image. Does anyone know a solution for this problem?
This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

3 replies

March 13, 2015
Hey Stephen,

Opacity is really a "modern browser" feature that may not work perfectly in older versions of IE.

For cross browser compatability, I would recommend using the solution found here.
March 14, 2015
Max is correct.  Another option I would try is to create the image in photoshop and add the opacity there, then upload the image exactly as you want it to appear.  You can avoid browser issues with this method.  However, from a design POV, modern design is moving away from background images like these to cleaner, more flat designs. It also helps with readability.
SanfordWhiteman
Level 10
March 14, 2015
@Stephen S There are enough very different IEs in the wild right now that you can't just say "IE."  If you are forced to support IE 8 (let alone IE 7) opacity is known to be pretty wack.  However, modern IE has no problem at all keeping up with the Chromes and Firefoxes.  What exact version of IE are you talking about, and what is the URL in question?