Mozilla 한국 커뮤니티

안녕하세요

질문이 있어 이렇게 글 남깁니다.

TABLE 중첩 레이아웃 을 버리려고 노력중인데요...

DIV로 처음 짠 홈피가 DIV 중첩이라..(TABLE처럼..)

이를 고쳐보려고 합니다.

----------------------------------------------
| |
----------------------------------------------
| | |
| | |
----------------------------------------------

이렇게 레이아웃을 나누고 싶을때

테이블로는 테이블 안에 테이블 뭐 이런식으로 하지만.

DIV는 따로 DIV태그를 이용해서 3블럭을 만든후

예를들어
<div></div>
<div></div>
<div></div>

각각의 위치를 left, 나 top을 이용해서 정해줘야 하는건가요?

만약 그렇다고 한다면

가운데정렬이 된상태의 위와 같은 레이아웃은

어떤식으로 해줘야 좋은 방법이 되는지 여쭙고 싶습니다.

허접한글 읽어주셔서 감사합니다.

위 레이아웃 입니다..^^;;
<pre>
----------------------------------------------
| |
----------------------------------------------
| | |
| | |
----------------------------------------------
</pre>

visualer wrote:위 레이아웃 입니다..^^;;
<pre>
----------------------------------------------
| |
----------------------------------------------
| | |
| | |
----------------------------------------------
</pre>

제 블로그의 구성과 비슷한 것 같군요. 게다가 전체 중앙정렬이라는 것도 같고요.

http://optic.egloos.com 입니다. 글은 썩 재밌는 글은 아니니까 과감하게 무시!!

개인적으로 Web Developer 확장을 이용하시는 편이 소스 분석에 도움이 되실 것입니다.

CSS가 미칠 듯이 많거든요.

CSS 레이아웃을 적용하시려면 기존과는 다른 개념으로 접근을 해야 합니다.

먼저 XHTML 을 레이아웃과 무관하게 작성 하십시오.

레이아웃을 고민하지 마시고, 문서 내용을 가장 잘 구분 할 수 있게 XHTML 을 작성하시기 바랍니다.
그러고 CSS 로 잘 구분된 XHTML 에 디자인을 입히세요.
이 과정에서 블록 select 에 문제가 발생 할 수 있습니다. 이 문제는 CSS Selector 를 잘 연구해 보시고, 그래도 안되면 javascript 를 생각해 보시고, 그래도 안되면 UI 가 잘못 된 것이 아니가 고민해 보시고 XHTML 에 추가 div 를 넣어서 해결해 보세요.

XHTML 을 CSS 에 잘 바인딩 되도록 작성하는 것은 순전히 경험에서 오는 것 같습니다. 하지만 레이아웃을 잘 작성하기 위해서 XHTML 을 작성해서는 안됩니다. 지금 단계에서는 레이아웃 생각 하지 마시고, 완벽한 XHTML 작성을 고민해 보시는 것이 좋습니다.