<!DOCTYPE html>
<html>

<head>
  <link data-require="bootstrap@*" data-semver="3.3.5" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" />
  <link data-require="bootstrap@*" data-semver="3.3.5" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.css" />
  <script data-require="bootstrap@*" data-semver="3.3.5" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
  <script data-require="bootstrap@*" data-semver="3.3.5" src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script>
  <link rel="stylesheet" href="style.css" />
  <script src="script.js"></script>
</head>

<body>
  <div class="container">
    <div class="row">
      <div class="col-sm-2 col-md-4">
        <ul class="list-group">
          <li class="list-group-item">Cras justo odio</li>
          <li class="list-group-item">Dapibus ac facilisis in</li>
          <li class="list-group-item">Morbi leo risus</li>
          <li class="list-group-item">Porta ac consectetur ac</li>
          <li class="list-group-item">Vestibulum at eros</li>
          <li class="list-group-item">Cras justo odio</li>
          <li class="list-group-item">Dapibus ac facilisis in</li>
          <li class="list-group-item">Morbi leo risus</li>
          <li class="list-group-item">Porta ac consectetur ac</li>
          <li class="list-group-item">Vestibulum at eros</li>
          <li class="list-group-item">Cras justo odio</li>
          <li class="list-group-item">Dapibus ac facilisis in</li>
          <li class="list-group-item">Morbi leo risus</li>
          <li class="list-group-item">Porta ac consectetur ac</li>
          <li class="list-group-item">Vestibulum at eros</li>
          <li class="list-group-item">Cras justo odio</li>
          <li class="list-group-item">Dapibus ac facilisis in</li>
          <li class="list-group-item">Morbi leo risus</li>
          <li class="list-group-item">Porta ac consectetur ac</li>
          <li class="list-group-item">Vestibulum at eros</li>
          <li class="list-group-item">Cras justo odio</li>
          <li class="list-group-item">Dapibus ac facilisis in</li>
          <li class="list-group-item">Morbi leo risus</li>
          <li class="list-group-item">Porta ac consectetur ac</li>
          <li class="list-group-item">Vestibulum at eros</li>
          <li class="list-group-item">Cras justo odio</li>
          <li class="list-group-item">Dapibus ac facilisis in</li>
          <li class="list-group-item">Morbi leo risus</li>
          <li class="list-group-item">Porta ac consectetur ac</li>
          <li class="list-group-item">Vestibulum at eros</li>
          <li class="list-group-item">Cras justo odio</li>
          <li class="list-group-item">Dapibus ac facilisis in</li>
          <li class="list-group-item">Morbi leo risus</li>
          <li class="list-group-item">Porta ac consectetur ac</li>
          <li class="list-group-item">Vestibulum at eros</li>
        </ul>
      </div>
      <div class="col-sm-10 col-md-8">
        <h1>Hello Stackoverflow...have some skittles</h1>
        <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
          <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ad, dolor maiores in consectetur reiciendis possimus adipisci culpa explicabo esse sapiente commodi exercitationem a nulla distinctio voluptate! Quis, totam, distinctio, ducimus, sit in
          sed id maiores magnam corporis earum voluptatibus vel minima fugiat eos necessitatibus pariatur amet esse maxime culpa neque atque sapiente aliquid vero rem nulla harum sunt blanditiis deleniti voluptates dolorem. Vero, beatae, doloremque at
          voluptates tempore minus sapiente. Laborum, necessitatibus, laboriosam, voluptatum ullam omnis sed voluptatem impedit reprehenderit doloribus sapiente distinctio voluptatibus tenetur autem itaque ipsum porro cupiditate natus nobis id amet consequuntur
          eos saepe enim ex recusandae!</p>
      </div>
    </div>
  </div>
</body>

</html>
// Code goes here

/* Styles go here */

.row {
  height: 100vh;
  overflow: auto;
}

.list-group {
  position: fixed;
  width: 360px;
  top: 0;
  bottom: 0;
  overflow: auto;
}