修复了居中div旁边的侧边栏

Question

我有一个居中的div（这是页面的主要内容）和属性margin: 0 auto，现在我想在它旁边修复一个侧边栏，但我不明白如何实现它。我可以用left: 30%或类似的东西来做，但那不是响应。

这就是我现在所拥有的：

https://jsfiddle.net/yp74vo70/

Answer 1

您可以使用：left: calc(50% + 50px);

div.centered {
    margin: 0 auto;
    box-sizing: border-box;
    border: dashed;
    width: 100px;
    height: 2000px;
}

div.sidebar {
    box-sizing: border-box;
    border: dotted;
    position: fixed;
    top: 150px;
    left: calc(50% + 50px);
    width: calc( (100% - 100px) / 2 );
}

<div>
  <div class="sidebar">
    RIGHT SIDEBAR
  </div>
  <div class="centered">
    CENTERED
  </div>
</div>

JSFiddle