HTML Layer display problem on IE
Recently, I was working on an online testing tool where I needed to generate some content dynamically to display on top of the page making the background blur. For some reason (I don’t know why), I used ‘layer’ rather than ‘div’. I use Mozilla Firefox browser. So when I tested the tool on Mozilla Firefox, it worked fine. However, when I sent the link to my colleague, it wasn’t working properly. It turns out that he was using IE to view the tool and unfortunately, IE has some issues rendering ‘layer’ tag.
I Googled this issue but couldn’t find any solution to make IE work with layer. Finally, I changed the ‘layer’ to ‘div’ and it started working fine on both browsers.
This is quite common to overlay or use Ajax to dynamically generate content. If you want to make sure that all users can access your tool/website, use div tag rather than layer. Layer tag is getting deprecated and some browsers stopped supporting layer.
What if all browsers rendered everything the same way…