본문 바로가기
공부/HTML5

table로 만들어진 홈페이지를 DIV로 바꾸기

by Ohming 2012. 7. 11.
336x280(권장), 300x250(권장), 250x250, 200x200 크기의 광고 코드만 넣을 수 있습니다.

오늘은 하루종일 table로 만들어진 홈페이지를 DIV로 바꾸는 작업을 했다.
서버를 옮기면서 아예 내부도 싹 바꾸는 작업이었는데, 우워어 이거 장난아니다.
물론 C언어로 코딩된 소스코드를 Java로 옮기는일보다는 덜 힘들었지만 DIV로 바꾸는 작업도 힘들긴했다. ㅋㅋ

DIV로 바꾸면서 자꾸 틀어지는것때문에 속상하기도 했는데 DIV로 구조 짜는것에 대해서는 많이 익숙해진 것 같다.

코딩하면서 나를 삽질하게 했던 두 가지 문제가 있었는데,
하나는 Div안에 넣은 Div가 가운데 정렬을 못하는 문제였는데 이건 margin: 0 auto; 로 해결을 봤고,
다른 하나는 부모 Div가 안에 있는 자식 Div 크기를 인식하지 못해서 Div 안에 있는 Div의 크기만큼 유동적으로 늘어나지 못하는 거였는데,
이건 안에 들어있는 자식 Div에 overflow:hidden; 을 해서 flow로 정렬된 자식 Div의 크기를 부모가 알 수 있도록 했다. 찾아보니 flow로 하면 이게 붕 떠서 정렬이 되는것이어서 부모 Div가 자식 Div 크기를 알 수 없던 거였었다.

댓글