<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> 
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"  isELIgnored="false"
 %>
 <%@ taglib uri="<http://tiles.apache.org/tags-tiles>" prefix="tiles" %>    
<%@ taglib prefix="c" uri="<http://java.sun.com/jsp/jstl/core>"%>
 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <style>
    
#container {
    width: 100%;
    margin: 0 auto; /* auto로 중앙 정렬 */
    text-align: center;
    border: 0 solid #bcbcbc;
    position: relative; /* 자식 요소의 절대 위치를 위한 기준 설정 */
}

#header {
    padding: 5px;
    width: 100%; /* 전체 너비 차지 */
    margin: 0; /* 여백 제거 */
    margin-bottom: 5px;
    border: 0 solid #bcbcbc;
    min-width: 1920px;
    box-sizing: border-box;
}

#footer {
    clear: both;
    width: 100%; /* 전체 너비 차지 */
    padding: 5px;
    margin: 0; /* 여백 제거 */
    border: 0 solid #bcbcbc;
    background-color: #F5F5F5;
    min-width: 1920px;
    box-sizing: border-box;
}

#container2 {
	display: flex;
	flex: 1;
	margin: 0 auto; /* auto로 중앙 정렬 */
	justify-content: center; /* 가운데 정렬 */
	min-width: 1370px;
  	max-width: 1370px;
	min-height: 1080px;
}

#content {
	flex: 3; /* 영역이 설정 */
	padding: 20px;
	/* background-color: #F5F5F5; */
	min-width : 986px;
	max-width : 986px;
	min-height: 1080px;
}

#side {
	flex: 1; /* 사이드바 영역 */
	margin-right: 50px;
	min-width : 280px;
	max-width : 280px;
	min-height: 1080px;
}

 /* 
 4개 추가해서 움직이는 거 방지함.
 해상도를 고정? 인듯
 width: 100%; 전체 너비 차지
 margin: 0; 여백 제거
 min-width: 1920px; 최소 너비 설정
 box-sizing: border-box; 패딩과 테두리를 포함한 너비 계산
 
  */     
    </style>
    <title><tiles:insertAttribute name="title" /></title>
  </head>
    <body>
    <div id="container">
      <div id="header">
         <tiles:insertAttribute name="header"/>
      </div>
      <div id="container2">
    <div id="side">
          <tiles:insertAttribute name="myPageSide"/>
      </div>
      <div id="content">
          <tiles:insertAttribute name="body"/>
      </div>
      </div>
      <div id="footer">
          <tiles:insertAttribute name="footer"/>
      </div>
    </div>
  </body>
</html>