Recently in the adventures of online programming, I have stumbled upon a new and exciting, yet old and determined bug. One so devious and yet so illusive and incredibly large that I can't believe I have never caught wind of it before. I am describing the hasLayout bug in IE. 

Let me explain. Elements rendered in IE are given certain dimensional variables.  "Layout" is one of those variables that allows IE to draw and bound the content currently being worked on.  Well, what does this really mean?  Basically some elements in the page are given this variable (setting it to true) that lets IE know it needs to draw them according to the standard applied by the layout concept.  

An element can then "gain layout" or "has layout" whenever hasLayout is true.  So when you're developing something, especially dynamic information on the web, you may notice certain things don't look right.  For instance, in my current case, I am using document.createElement("DIV") and document.body.appendChild([object]) to create a custom modal box.  Well, I noticed that when this was done on the fly, and the modal box was to appear... all background-images were missing from the modal box. 

It turns out that even though I have div's with heights, widths, etc... because I am creating them on the fly, they did not 'hasLayout', so to speak.  So a rendering of the object was not fully completing to the point the background-images would randomly not work. And I mean randomly, some would and some would not work, or none at all, or all of them would work.  Very difficult bug to track down, took me nearly 2 weeks to figure it out.  

hasLayout is something that I have missed upon my travels of the web.  I am sure there are many more out there that have missed this interesting concept and bug provided by the good ol' Internet Explorer.  In any case, check out this link for a much more in depth resolution to the issue, and learn while your fixing!