컨테이너가 aside 옆으로 붙었으면 좋겠습니다.
컨테이너의 css 에서 float:left 속성을 주면 하단에 있는 정보부분도 붙게 됩니다. float:right 속성을 주어도 마찬가지입니다.
|
답변 5개 / 댓글 8개
채택된 답변
+20 포인트
port443
2015-12-17 (목) 10:47:12
#ft 는 clear:both 를 주는게 맞구요.
레이아웃 구성이 각각 다 다른가요?
이건 레이아웃을 다시 생각해보시는게 나으실거 같은데요 ;
우선 소스가 난잡해서 더 보기 어려울거 같아요
컨테이너 안에 컨테이너도 보이고
바디 안에 스타일 시트가 보이고
답변에 대한 댓글 2개
muzluv
2015-12-17 (목) 10:52:35
아.. 제가 #ft 에 clear:both를 주지 않았습니다... 위에 글에 주라고 하셨는데, 안했네요. 이거 주니까 해결 되었습니다. 정말 감사드립니다.
port443
2015-12-17 (목) 10:34:28
답변에 대한 댓글 2개
muzluv
2015-12-17 (목) 10:39:11
http://3004ch.db21.net/bbs/content.php?co_id=ministry_mission
가운데 내용이 wrapper 을 벗어나게 됩니다.
그래서 tail 의 내용이 수직정렬이 되지 않습니다.
저는 tail 부분에 border-top, margin-top, padding-top 을 주어서 여백을 만들고 싶습니다.
가운데 내용이 wrapper 을 벗어나게 됩니다.
그래서 tail 의 내용이 수직정렬이 되지 않습니다.
저는 tail 부분에 border-top, margin-top, padding-top 을 주어서 여백을 만들고 싶습니다.
muzluv
2015-12-17 (목) 10:53:40
제가 아직 배운지 얼마 안되서....;;; 제대로 배운적도 없어서 소스가 많이 지저분합니다...
정말 감사합니다.
정말 감사합니다.
2015-12-17 (목) 10:28:42
아래 카피라이트를 감싸는 div에 clear:both 를 하시면 됩니다.
예) #ft {clear:both;}
답변에 대한 댓글 2개
muzluv
2015-12-17 (목) 10:30:06
muzluv
2015-12-17 (목) 10:30:28
각각의 div에 border 주었습니다. 그런데 좌측으로 정렬이 되지 않습니다.
port443
2015-12-17 (목) 10:24:29
clear:both 해보세요.
답변에 대한 댓글 1개
2015-12-17 (목) 09:47:57
컨테이너 width + aside width 가 두개를 감싸고있는 div의 width 보다 크면 발생하는 문제입니다.
감싸고 있는 div의 width 를 조정하시거나 컨테이너 width , aside width 를 조정하시면됩니다.
답변에 대한 댓글 1개
muzluv
2015-12-17 (목) 10:05:27
#wrapper{z-index:5;width:100%; min-width:1200px;zoom:1;margin:0 auto; border:#093 3px solid}
#wrapper_container {width:1200px; margin:0 auto; border:#093 solid 3px; padding-top:15px}
#container{width:900px; min-height:500px; /*position:relative; float:left;*/;}
#aside {float: left;width:220px;margin:0px 30px 0 30px; /*border: 1px solid #e3e3e3;*/border-bottom: 0;}
전체를 잡아줄 수 있는 div에 #wrapper 을 주었고, 가운데 정렬을 위해서 div를 만들어서 #wrapper_container 을 주었습니다. 전체 div에 width를 100%주었고 가운데 div에 1200px 을 주었습니다. 그리고 좌측 메뉴를 위해서 div를 만들어 #aside라는 이름을 주었고, width는 200 우측 margin을 50, 좌측을 30을 줬습니다. 그리고 가운데 내용을 위해서 div를 만들어 #container을 주고 width를 900을 주었습니다.
200+50+30+900 이므로 width는 정확히 1200이 나오는데, 정렬이 되지 않습니다.
그래서 우측 margin을 30으로 주어서 1180이 나오도록 해봐도 여전히 정렬이 되지 않습니다.
#wrapper_container {width:1200px; margin:0 auto; border:#093 solid 3px; padding-top:15px}
#container{width:900px; min-height:500px; /*position:relative; float:left;*/;}
#aside {float: left;width:220px;margin:0px 30px 0 30px; /*border: 1px solid #e3e3e3;*/border-bottom: 0;}
전체를 잡아줄 수 있는 div에 #wrapper 을 주었고, 가운데 정렬을 위해서 div를 만들어서 #wrapper_container 을 주었습니다. 전체 div에 width를 100%주었고 가운데 div에 1200px 을 주었습니다. 그리고 좌측 메뉴를 위해서 div를 만들어 #aside라는 이름을 주었고, width는 200 우측 margin을 50, 좌측을 30을 줬습니다. 그리고 가운데 내용을 위해서 div를 만들어 #container을 주고 width를 900을 주었습니다.
200+50+30+900 이므로 width는 정확히 1200이 나오는데, 정렬이 되지 않습니다.
그래서 우측 margin을 30으로 주어서 1180이 나오도록 해봐도 여전히 정렬이 되지 않습니다.
답변을 작성하려면 로그인이 필요합니다.