Div로 레이아웃 잡기 궁금한점??
찬놀
안녕하세요.
가입하자 말자 질문을 ㅋ
지금껏 습관적으로 table 태그로만 웹페이지를 만들었는데
효율성을 따지자면 div를 사용하는게 좋다고 해서
오랜 습관을 한번 바꿔 볼까해서 공부중입니다.
그런데 Div를 사용하게 되면 마음대로 안되는 부분이 좀 있네요.
그림에서 처럼 공간을 좌우 몇구역으로 나눌려고 하면
table인 경우 table 하나만 있으면 td 태그로 공간을 나눠서 쉽게 사용할 수 있잖아요.
그런데 Div 로 할려면 div를 몇개씩 둘러싸야 겨우 되는것 같은데요? (익숙치 않아서...)
이해하기는 Div를 만들어서 위치값이나 배열속성을 다르게 해서 공간에서 자리를 잡게 하는것 같은데
이게 잘 이해가 안가네요.
첫 div 다음에 두번째 div가 달라 붙게 하고 세번째 div가 순서대로 나오게 하고 그런식인듯 한데
width 값을 정확히 하지 않으면 아래 줄로 내려가 버리기도 하더군요. 또 하위 div로 공간을 또 나눌려고 하면
몇개의 div로 둘러싸게 되는 어떻게 보면 더 복잡해지는 태깅이 되는것 같은데 ... 원래 그런건지 아님 잘못 이해를 하고
있는건지 궁금합니다.
그리고 div 안에서 이미지나 text 가 세로공간의 중간에 위치하는 속성이 안되는것 같은데 어떻게 하는지 궁금합니다.
table 인 경우 td 태그안 valign=middle 해주면 td 의 높이가 바뀌면 자동으로 오브젝트가 가운데 위치가 되잖아요.
그게 div에서는 안되는듯 하더군요? 어떻게 하는지 궁금합니다.
질문을 말로 할려니 글이 길어저 버렸네요. ^^;;
-
나오
저도 개념이 안잡혀있네요....ㅠㅠㅠㅠ
뭐 어떻게 감싸야 하는지....ㄷㄷㄷㄷ -
덕이
저도 테이블로 화면을 구성하다 요즘 div로 하려니까 아직은 개념이 잘 이해가 안가네용 ㅠ.ㅠ
-
좋아해
div 로 레이아웃을 잡기 위해선 몇가지 속성(float, clear) 특징(박스모델) 을 알고 있어야 합니다.
그리고 일반적으로 div 와 같은 블럭 엘리먼트에서는 vertical-align:middle속성이 적용되지 않습니다.
최근의 표준 브라우져에서는 table-cell 이란 속성으로 이런것들이 가능 하지만 ie 브라우져에서는 아직 지원 하지 않는 속성입니다. 검색에 - div vertical-align:middle 등으로 검색을 하시면 관련 -
둘빛
답변글 감사합니다.