CSS: 高さ（height: 100%）が効かない

Question

実現したいこと

2カラムのページを作っている中で、カラム間に縦線を引いて視覚的に分かりやすくしたいです。

困っていること

itemsの要素に対して、height:100%としてborder-leftの線を引いてるのですが、itemsの中の子要素が増えていくとheight:100%を指定しているのにも関わらず、途切れてしまうのを解決したいです。

<div class="container">
  <div class="sidebar">
   <!--　省略 -->
  </div>
  <div class="items">
    <div class="item">Item1</div>
    <div class="item">Item1</div>
    <div class="item">Item1</div>
    <div class="item">Item1</div>
  </div>
</div>

.container {
  max-width: 750px;
}
.sidebar {
/*...省略*/
}
.items {
 height: 100%;
 border-left: 1px solid #333;
}
.item {
/*...省略*/
}

Comments

[kei344]

https://jsfiddle.net/859Lr1ez/
問題が再現しません。書かれている状況が再現するコードとスクリーンショットを質問文に追記されたほうが回答を得やすいと思います。

[nanase21]

コメントありがとうございます。
teratail内で同じ事象で困っている方いないか調べてみたところ以前、kei344さんがご回答している質問で解決できました。
https://teratail.com/questions/92685

Answer 1

kei344さんが以前、回答した質問で解決できました。
https://teratail.com/questions/92685