<!DOCTYPE html>
<html>

  <head>
    <link data-require="bootstrap@4.0.0-alpha.6" data-semver="4.0.0-alpha.6" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" />
    <link rel="stylesheet" href="style.css" />
  </head>

  <body>
    
    <div class="container-fluid">
      <div class="mt-3 card">
        <div class="card-block">
          <div id="test" class="test"></div>
        </div>
      </div>
    </div>
    
    <script src="script.js"></script>
  </body>
</html>
// Code goes here

var test = document.getElementById('test');


console.log('size', test.getBoundingClientRect());
html,
body {
  min-width: 100%;
  height: 100vh;
  background-color: #f2f1f2;
}

.test {
  background-color: crimson;
  min-height: 300px;
}