CSS - 문제 미리보기
문제 1239
easy
다음 CSS 코드의 빈칸에 들어갈 올바른 값은?
```css
div {
width: 600px;
margin: _____;
}
```
div 요소를 가로로 가운데 정렬하고 싶을 때
```css
div {
width: 600px;
margin: _____;
}
```
div 요소를 가로로 가운데 정렬하고 싶을 때
정답: B
가로 가운데 정렬의 원리:
margin: auto의 동작:
• 좌우 여백을 자동으로 균등 분배
• 남은 공간을 양쪽으로 동일하게 배분
• 결과적으로 요소가 가운데 위치
계산 과정 예시:
• 부모 너비: 1000px
• 자식 너비: 600px
• 남은 공간: 400px
• 좌우 margin: 각각 200px
다른 값들의 문제점:
• center: margin 값이 아님 (text-align용)
• 0: 여백 없음 (왼쪽 정렬 유지)
• middle: margin 값이 아님
margin: auto의 동작:
• 좌우 여백을 자동으로 균등 분배
• 남은 공간을 양쪽으로 동일하게 배분
• 결과적으로 요소가 가운데 위치
계산 과정 예시:
• 부모 너비: 1000px
• 자식 너비: 600px
• 남은 공간: 400px
• 좌우 margin: 각각 200px
다른 값들의 문제점:
• center: margin 값이 아님 (text-align용)
• 0: 여백 없음 (왼쪽 정렬 유지)
• middle: margin 값이 아님
💡 학습 팁
이 문제를 포함한 CSS 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.