左右のマージンを変えて（オートマージンのように）応答しながらジャンプすることなく滑らかなブロック幅を得るには？

Question

レスポンス中にブロックの左右のマージンに関する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からウィンドウ幅を変更すると

​​3210

、それは左マージンを25％にジャンプします。 これは、1024pxから余白をスムーズに増やす（ジャンプしない）ようにして、1171pxで、たとえばautoのように1600px、300pxで200px（左余白）に達するようにする方法ですマージン。ウィンドウが増加した場合、例えば 、

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

は、ラッパー・ブロックは中央にあり、左右マージンが等しい余裕を持ってスムーズに増加するであろう。 同じではあるが、左右の余白が異なる必要があります。 これは可能ですか？ 私はあなたの助けに感謝します。

Answer 1

使用の移行がスムーズにするには、このような何か...

transition: 0.5s ease-in-out 0.5s;