html - 使右列跟随左列

我已经用不同的颜色标记了两个div。右列（粉红色）不跟随左列（绿色）。

这是我的小提琴：JSfiddle

* {
  margin: 0px;
  padding: 0px;
  border: 0px;
}
#wrapper {
  width: 960px;
  margin: 0 auto;
  height: auto;
  background-color: #1b191a;
  overflow: hidden;
}
#leftcolum {
  float: left;
  width: 614px;
  padding: 15px;
  background: #0C6;
}
#rightcolum {
  float: right;
  width: 286px;
  padding: 15px;
  background: #F09;
  -webkit-box-shadow: inset 6px 0px 8px -3px rgba(0, 0, 0, 0.5);
  -moz-box-shadow: inset 6px 0px 8px -3px rgba(0, 0, 0, 0.5);
  box-shadow: inset 6px 0px 8px -3px rgba(0, 0, 0, 0.5);
}

<div id="wrapper">
  <div id="leftcolum">
    <p>Lorem ipsum dolor sit amet, etiam congue, elit ut a vivamus mauris erat. At aliquam saepe mauris sit. Aenean vulputate porttitor, cras duis magna, ac sed etiam blandit. Sem eu. Eu nulla mauris aenean magna. Nibh viverra nec ullamcorper cras non justo.
      Sed suscipit fugiat tristique, et pede ante nunc amet, felis gravida nibh placerat, scelerisque sapien fames pede lorem, elit suspendisse mi quam eget. Vitae sed justo nisl vitae nisl, accumsan vitae est. Molestie urna ullamcorper, quis non bibendum.
      Purus mauris eget sed elit nonummy. Vitae amet, mus tempor, turpis donec sodales in, eget lacinia eros eleifend tincidunt non eget. Dui consequat morbi justo sed tincidunt, consequat felis adipiscing, suscipit feugiat porttitor eget quam blandit
      nunc, aliquam morbi aliquam purus, vivamus volutpat adipiscing sed. Elementum placerat donec molestie, iaculis est faucibus ullamcorper. Dui massa leo a fusce iaculis, massa rhoncus ipsum nascetur eleifend vestibulum quam, in aliquam in mattis quisque
      iaculis nisi, id vestibulum lobortis eros tincidunt.</p>
  </div>
  <div id="rightcolum">
    <div class="menubg">
    </div>
  </div>
</div>

我已经尝试了很长时间了，使用google等。没事。我不是position:absolute，relative等的忠实拥护者。我试图使HTML和CSS尽可能简单。

最佳答案

只需将display: flex;添加到#wrapper（这使其成为一个flexbox容器）

https://jsfiddle.net/7cb6q238/