[컴][웹][html] TD 와 Div 가 size 를 결정하는 방식

table 에서 div 사용하기, table 대신 div 사용하기 / table 과 div 의 관계 / div 의 width 결정방법 / div size 를 아는 방법

TD 와 Div

td 안에 div 로 된 녀석을 javascript 에서 생성해서 add 하고 있었는데, 문제가 생겼다. div 의 내용이 긴 녀석을 있었는데, 그녀석 때문에 td 크기가 너무 길어져 버렸다.(아래그림 참조)

왜 이럴까 해서 좀 찾아봤더니 아래에 관련 글이 있었다.

• html - is a DIV inside a TD a bad idea? - Stack Overflow

대략적으로 이야기 하면, div 는 기본적으로 width 를 정할 때 parent element 의 width 를 자신의 width 로 정하게 된다고 한다. 그런데 table cell(여기서는 td) 은 cell 안의 내용의 size 를 보고 자신의 size 를 정한다고 한다. 결국 서로가 서로를 보고 판단하려고 하는 것이다.(거의 dead lock 이야기 같다.)

여하튼 그래서 td 가 만들어진 이후에 js 로 div 를 끼워넣어서는 td 의 size 가 자동으로 다시 줄어들 수는 없을 듯 하다. (물론 강제로 width 를 설정해 줄 수는 있다.)