절대 위치 지정 및 중심 div의 여백을 창 크기 변경에 유지

컨테이너로 사용되는 페이지가 거의없는 div가 있습니다. div 중 하나의 샘플 CSS 코드는 다음과 같습니다.절대 위치 지정 및 중심 div의 여백을 창 크기 변경에 유지

header { 
    background-color: #fff; 
    height: 153px; 
    width: 97%; 
    min-width: 1084.06px; 
    margin: 15px auto; 
    position: absolute; 
    left: 0; 
    right: 0; 
    border-radius: 20px; 
}

내 머리글의 가운데있는 컨테이너입니다. 비슷한 다른 스타일의 컨테이너가 있습니다 (절대, 중앙 및 폭).

문제는 창의 크기를 조정할 때 모든 컨테이너가 브라우저 창의 왼쪽에 충돌한다는 것입니다. 특정 창 너비에 약간의 여유를두고 싶습니다. 어떻게하면 될까요?

P. 내가 margin-left를 추가하는 경우는 DIV

출처

2016-12-28 qazerty23

를 참조 미디어에 대한 더 많은 정보

@media screen and (max-width: 480px) { body { background-color: lightgreen; } }

, 좌우 값을 몇 퍼센트로 변경하십시오 (예 : 5 %). 또는 미디어 쿼리를 사용할 수 있습니다 (https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries) – Armin

감사합니다 @Armin, 너비를 제거하고 왼쪽 및 오른쪽 값에 백분율을 추가하여 원하는대로 달성했습니다. ! 미디어 쿼리에 대해서도 배우게됩니다! – qazerty23

다음 다른 여백 오른쪽 추가하기 당신은 미디어 쿼리를 사용할 수 있습니다

출처

2016-12-28 15:23:06 Coomernatior

를 사용 내용에 따라 그것을 밖으로 곧게 내 중심 위치를 나누기, 미디어 쿼리은, 특정 조건에 적용됩니다 특정 너비와 같은 예를 들어

다음 배경 색 규칙이 넓은 480 픽셀보다 화면이 적용되지 않습니다 쿼리 당신은 당신의 너비를 제거 할 수 있습니다 this w3schools page

출처

2016-12-28 16:14:52

절대 위치 지정 및 중심 div의 여백을 창 크기 변경에 유지

답변

관련 문제