hmw1001
28 lines
765 B
CSS
28 lines
765 B
CSS
/*
|
|
!* 레이아웃 CSS *!
|
|
.flex_box_l {float:left; width: 30%;}
|
|
.flex_box_r {float:right; width: 70%;}
|
|
|
|
*/
|
|
/* 📌 [전체 수정] float 대신 Modern Flexbox를 사용하여 레이아웃을 안정적으로 구성합니다. */
|
|
|
|
.three-column-layout {
|
|
display: flex;
|
|
gap: 30px; /* 컬럼 사이의 간격 */
|
|
}
|
|
|
|
.layout-sidebar-left {
|
|
flex: 0 0 240px; /* 좌측 사이드바 너비 고정 */
|
|
}
|
|
|
|
.layout-main-content {
|
|
flex: 1; /* 중앙 콘텐츠가 남은 공간을 모두 차지하도록 설정 */
|
|
min-width: 0; /* 내용이 많아져도 레이아웃이 깨지지 않도록 설정 */
|
|
}
|
|
|
|
.layout-sidebar-right {
|
|
flex: 0 0 240px; /* 우측 사이드바 너비 고정 */
|
|
}
|
|
|
|
/* 반응형: 1024px 이하에서는 세로로 쌓이도록 변경 */
|