Skip to content

Instantly share code, notes, and snippets.

@cconrad
Created December 11, 2014 09:28
Show Gist options
  • Save cconrad/5b0ed7686ef6d3b835bf to your computer and use it in GitHub Desktop.
Save cconrad/5b0ed7686ef6d3b835bf to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head>
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<meta charset="utf-8">
<title>JS Bin</title>
<style id="jsbin-css">
html, body, .sb-main-wrapper {
margin: 0;
padding: 0;
height: 100%;
}
.sb-main-wrapper {
display: table;
}
.sidebar {
background:blue;
width:auto;
height:100%;
display:table-cell;
white-space: nowrap;
}
.state-content {
background:red;
height:100%;
display:table-cell;
width:100%;
}
</style>
</head>
<body>
<div class="sb-main-wrapper">
<div class="sidebar">
Hello
</div>
<div class="state-content"></div>
</div>
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html>
<head>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<meta charset="utf-8">
<title>JS Bin</title>
</head>
<body>
<div class="sb-main-wrapper">
<div class="sidebar">
Hello
</div>
<div class="state-content"></div>
</div>
</body>
</html></script>
<script id="jsbin-source-css" type="text/css">html, body, .sb-main-wrapper {
margin: 0;
padding: 0;
height: 100%;
}
.sb-main-wrapper {
display: table;
}
.sidebar {
background:blue;
width:auto;
height:100%;
display:table-cell;
white-space: nowrap;
}
.state-content {
background:red;
height:100%;
display:table-cell;
width:100%;
}
</script>
</body>
</html>
html, body, .sb-main-wrapper {
margin: 0;
padding: 0;
height: 100%;
}
.sb-main-wrapper {
display: table;
}
.sidebar {
background:blue;
width:auto;
height:100%;
display:table-cell;
white-space: nowrap;
}
.state-content {
background:red;
height:100%;
display:table-cell;
width:100%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment