레이아웃잡을때... 순서 질문입니다.
블레이
수다닷컴에 올라와 있던 소스들을 참조해서 이런 기본 레이아웃을 잡아보았습니다. ^^:
그런데요, div 코딩의 장점 중에 하나가 테이블과 달리 위- 아래 , 왼쪽 - 오른쪽의 순차적인 순서가 아니라
컨텐츠 자체의 중요도에 따라 html 코드들의 순서를 조정할 수 있다고 봤는데요
그래서 저 위에 레이아웃중에
왼쪽칼럼 - 뉴스칼럼 - 오른쪽칼럼 순이 아니라
뉴스칼럼 - 왼쪽칼럼 - 오른쪽칼럼 순으로 코드 순서가 나오고 화면상으로는 저처럼 나오게 하고 싶은데
그런건 어떻게 하는건가요?
너무 초보적인 질문이라 죄송합니다. ^^:
(첨부한 파일은 div로 레이아웃을 잡았지만 테이블과 다를바 없이 코드 순서가 왼쪽칼럼 - 뉴스칼럼- 오른쪽칼럼으로 되어 있는 소스입니다... -__-;)그러니까... 아래처럼 해서 왼쪽-뉴스-오른쪽 이렇게 나오게 하고 싶은데
애들이 막 뒤집어지네요. 소스상에 뉴스칼럼이 왼쪽칼럼 다음에 나올땐 잘되는데 말이죠... ^^;;;
#CONTENT{position:relative;width:980px;margin:0 auto;text-align:left;}
#leftcolumn {float:left;width:240px;background-color:#EFEFEF;}
#newsColumn {display:inline;float:left;width:480px;margin:0 10px;background-color: #000;}
#rightcolumn {float:right;width:240px;background-color: #EAEEF7;}div id=CONTENT
div id=newsColumn
뉴스칼럼
/div
div id=leftcolumn
왼쪽칼럼
/div
div id=rightcolumn
오른쪽칼럼
/div
/div
-
한누리
소스 편집창에서 순서를 바꾼다는거라면
#wrapper 전체레이아웃 감싸주시고요
각 id를 float 설정에 따라 웹상에서 보여지는 순서를 적용할수있습니다
html 코드상의 위치는 web에 적용되지 않습니다. -
튼튼
아쇼라찡뽕빵 ㅎㅎㅎㅎ 참고하겠습니당. ^^
-
화이트
마크업을 하실 때 반드시 위에서 아랫 방향으로 왼쪽에서 오른쪽 순서를 잡으시고 마크업을 하셔야 합니다. 만약 순서가 뒤바뀐 상태에서 홈페이지가 완성된다면, 키보드 접근 순서가 뒤바뀐 아주 아쇼라찡뽕빵한 결과를 가져올 수 있습니다.
-
라온제나
#leftcolumn {float:left;width:240px;background-color:#EFEFEF;margin-left:-740px;}
#newsColumn {display:inline;float:left;width:480px;margin:0 10px 0 250px;;background-color: #000;}
#rightcolumn {float:right;width:240px;background-color: #EAEEF7;}
이렇게 줬더니 -
여름
검색을 좀 하다보니 저렇게 코딩을 하려면 \margin의 음수 값을 사용해야하는...참.....아스트랄한 코딩이 되실꺼예요\라고 수다님의 댓글이 있던데... 음. 누가 음수가 되어야 하는지 ^^:
-
안찬
음... 지금 왼쪽칼럼,뉴스칼럼,오른쪽칼럼은 content라는 div로 한번 감싸줬는데요... 왼쪽은 left로 오른쪽은 right로 줬더니 뉴스칼럼이 왼쪽 위에 나오고 바로 아랫단에 왼쪽칼럼이 왼쪽에 오른쪽칼럼이 오른쪽에 자리잡네요. 뉴스칼럼에도 float를 줘야하는건가봐요.. 그런데 어떻게 줘야 할런지 ^^: