Template Test

by Ricardo Zambon

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<nav class="navbar navbar-default navbar-fixed-top">
        
</nav>

<div class="table fullheight">
  <div class="row">
    <div class="col actionbar expanded">
      1
    </div>
    <div class="col">
      1
    </div>
  </div>
 </div>

CSS

html, body, .table.fullheight { height: 100%; min-height: 100%; }

body {
  margin: 0;
  padding: 0;
}

.table {
  display: table;
  margin-bottom: 0;
}

.table .row {
  display: table-row;
}
.table .col {
  display: table-cell;
  width: auto;
}

.table.fullheight {
  position: relative;
  margin-top: -50px;
  padding-top: 50px;
}

.actionbar {
  border: 1px solid;
}

.actionbar.expanded {
  width: 200px;
}
.actionbar.minimized {
  width: 45px;
}

.navbar {
  position: relative;
  margin: 0;
  
}