一淘九宫格面试题，bug疑问求解？

Question

JSBin*{margin:0;padding:0;}#container{width:135px;border-top:5pxsolid#00f;border-left:5pxsolid#00f;}a{float:left;width:40px;height:40px;border:5pxsolid#00f;margin-left:-5px;margin-top:-5px;}a:hover{border-color:#f00;position:relative;}123456789在线测试：http://jsbin.com/otuqag/1/此代码在ie6中意外折行，已经测试过以下方案：1可行方案：在#container与a之间嵌套个inline元素，如span。2可行方案：把代码之间的换行符删除掉。3不可行方案：设置#container{font-size:0;letter-spacing:-1px}。从解决方案上看，似乎是whitespace的问题(2解决了bug)，但又不是（3没解决）；当我在a的后面又加了三个a，然后问题突然又很像ie6的幽灵文本bug了！请教了。ps：请把问题关注点放在：ie6的这个bug的触发条件是什么?产生此bug的原因什么？至于其他的方案，例如你的代码不够语义化，应该在a外面嵌套个li、改用inline-block布局、改用table布局等方案就不用说了。