为什么这条css样式 margin 和 left和 right都在发挥作用？

Question

如下，尤其不理解 margin 和 left和 right 三者怎么相互作用的？

{
  width: calc(100% - 60px);
  margin: 0 auto;
  max-width: 1200px;
  height: 100%;
  position: absolute;
  left: 0px;
  right: 40px;
}

Answer 1

首先，我先自行解释下，你是定位元素，而且你指定了它的位置是left:0,right: 40, 也就是这区间都是这个元素占据的空间，但是你同时又指定了宽度是100%-60,那么也就是说，在原本分配的空间中，实际只用了100%-60的空间，那么剩余的空间呢？答案就是给了margin,因为auto的意思就是均分剩余的空间。
好了，说这么多其实我也是受大佬指教的，这里我就顺便给楼主搜了下大佬的文章————相信应该解释的是相当详细了——
https://www.zhangxinxu.com/wo...