IE의 버그 주석버그

레이아웃을 테스팅을 해가면서 짜고 있었다..

달랑 2단 레이아웃일 뿐이라 그렇게 신경쓰지 않고 코딩을 해가고 있었다.

코드수가 작을 경우는 몰라도 점점 늘어날경우를 대비해서 주석을 일일이 달아가며 레이아웃을 짜고 테스팅을 하던 차에 이상한 에러가 발생했다.

코드는 아주 단순하다.

css
/*content*/
            #sub_side {float:left;width:200px;margin:0px;padding:0px;text-align:left;}
            /* \*/
            /* ie win 5.5, 6 win */
            #main {float:left;width:500px;height:1%;margin:0px;padding:0px;text-align: justify;}
            /* */

html
                <!-- comment -->
               <div id="sub_side">                  
                사이드메뉴
                </div>
                <!-- comment -->  
                <!-- comment -->
                <div id="main">              
                본문 내용
                </div>           
                <!-- comment -->

그런데 이상하게도 본문네용의 글들이 사이메뉴쪽에서 마치 position:absolute를 한것 처럼
그것도 본문내용의 마지막 자리를 카피하여 딸려 나오는 것이였다.

처음 코딩시 오타가 있었는지를 검사하고 다시 해보아도 똑같은 일이 벌어졌다.
그리하여 혹시 하는 마음에 css 코드에 overflow:hidden값을 주었지만 역시나..
그리고 overflow:hidden값을 주어선 안된다고 하는 글을 본것 같다. padding값을 무시하지한다는 현상이 일어난다며 하지만 그런것 크게 상관없었다..

근래들어 부쩍 이상하게 IE에서 버그가 많아지 길래 이것도 하나의 버그가 아닐까하는 생각이 들었다.
그리하 파이어폭스, 넷스케이프, 오페라, 심지어는 사파리가지 적용시켜 보았다.
어라 신기하게도 IE빼곤 모두 정상적으로 보여진다.

한참을  뒤적이다가 이런 글을  보게되었다. 이글에선 버그라고 이야기 한다. 해결법을 모르겠다. 그래서 머 중간에 있던 주석을 지워버렸다.

                <!-- comment -->
              <div id="sub_side">                  
               사이드메뉴
               </div>
                <!--주석삭제-->
               <div id="main">              
               본문 내용
               </div>           
               <!-- comment -->
 
정상으로 보여진다.

Why?

궁금하다..