I ran into an issue in IE6 with a bunch of my controls not showing up when the page loaded. It was specially with the RadioGroup control in ExtJS. The radio buttons would display fine in Firefox but not appear at all in IE6 even though the HTML was present. I thought it was a width or height issue as it is often the case with ExtJS and IE6 but nothing i did could take care of the problem. I then looked at the container panels of the RadioGroups i was trying to display and realized that i was using a “layout:column” setting, which floats the items in the container left.

During my research on this bug, i stumbled upon a bug in IE6 called the “PeekABoo” bug where content inside a liquid floated bug suddenly disappears. I am not exactly sure the issue is completely related to the problems I was facing but it seems related. In order to get my radiogroups to display, i had to change the value to “layout:auto”. This worked for me and it is the default value if no layout property is specified. In general, I’ve found out that display issues in IE also are related to setting an actual width or height property on panel objects.  Well you know what to try in case you run into the issue and share in the comments whatever solution worked for you. It can be nightmarish to figure out what’s going on, and this is the reason why i decided to share my experiences on this blog.