* {  
  margin:0;  /* 브라우저 기본 마진 리셋 */
  padding:0;  /* 브라우저 기본 패딩 리셋 */
  box-sizing: border-box;  /* 테두리까지 포함해서 박스 모델 너비로 계산 */
}
#container {
  width:1200px;   /* 내용 전체의 너비 */
  margin:20px auto;  /* 내용을 화면 가운데 배치하도록 좌우 마진을 auto로 */
}
#header{
  width:100%;  /* 부모 요소의 너비와 똑같게 */
  height:120px;  /* 헤더의 높이 */
  background-color:#acacac;
}
#left-sidebar {
  width: 250px;   /* 사이드바의 너비 */
  height:600px;  /* 사이드바의 높이 */
  background-color:#e9e9e9;
  float: left;  /* 왼쪽으로 플로팅 */
}
#contents {
  width: 800px;  /* 본문의 너비 */
  height:600px;   /* 본문의 높이 */
  background-color:#f7f7f7;
  float: left;  /* 왼쪽으로 플로팅 */
}
#right-sidebar {
  width: 150px;   /* 사이드바의 너비 */
  height:600px;  /* 사이드바의 높이 */
  float: left;  /* 왼쪽으로 플로팅 */
  background-color:#e9e9e9;
}
#footer {
  width:100%;  /* 부모 요소의 너비와 똑같게  */
  height:100px;  /* 푸터의 높이 */
  background-color:#888888;
  clear:left;		/* 플로팅 해제 */
}