2016-10-21 20 views
0

응답 중 블록 왼쪽/오른쪽 여백에 관한 CSS 질문이 있습니다. 나는 이런 식으로 뭔가가 필요합니다왼쪽 및 오른쪽 여백을 다르게하여 자동 마진과 같이 반응하는 동안 점프없이 부드러운 블록 너비를 얻는 방법은 무엇입니까?

@media screen and (max-width: 1024px) { 
    body .wrapper { 
    width:100%; 
    } 
} 
@media (min-width: 1024px) and (max-width: 1170px) { 
    body .wrapper { 
    width:70%; 
    margin: 0% 5% 0% 25%; 
    } 
} 
@media (min-width: 1170) and (max-width: 1600px) { 
    body .wrapper { 
    width:65%; 
    margin: 0% 10% 0% 30%; 
    } 
} 

HTML : 내가가 1024px에서 창 폭을 변경하는 경우

<body> 
    <div class="wrapper">text here</wrapper> 
</body> 

, 그것은 왼쪽 여백을 25 %로 점프합니다. 1024px에서 왼쪽 여백을 백분율로 늘리고 점프하지 않고 1171px로 설정하면 1600px, 예를 들어 auto와 같이 200px (왼쪽 여백)까지 도달합니다. 여유. 윈도우가 증가하면 예 ,

@media screen and (min-width: 1024px) { 
     body .wrapper { 
     width:1024px; 
     margin:0 auto; 
     } 
    } 

은 랩퍼 블록 중간에 좌우 마진이 동일 마진을 원활하게 증가한다. 동일하지만 다른 왼쪽 및 오른쪽 여백이 필요합니다. 가능합니까? 귀하의 도움에 감사드립니다. 부드러운 전환을 위해이 같은

답변