Skip to content

Instantly share code, notes, and snippets.

@danielmascena danielmascena/dabblet.css
Last active Jul 21, 2017

What would you like to do?
*{box-sizing: border-box;}
body{font-family: Arial, sans-serif;}
.container {
background: #ccc;
border: 1px solid;
.container:after {
content: '';
display: table;
[class^='el'] {
padding: 10px;
float: left;
width: 50%;
.el-1 {
background: #0cf;
.el-2 {
background: #0fc;
height: 50px;
.main {
background: #cf0;
border: 1px solid;
height: 100px;
width: 100px;
margin: 10px;
#big-box {
background: lightblue;
position: relative;
overflow: auto;
.box{padding: 20px; background: lightgray; margin: 20px 0; width:100%;}
.box:first-child{position:absolute;top:50px;background: red;}
<div class="container"> <div class="el-1">A long string of stuff here...</div> <div class="el-2">A short string of stuff here...</div>
<div class="main"> Some stuff here...</div>
<div id="big-box"><div class="box"></div><div class="box"></div></div><div class="box"></div><div class="box"></div>
// alert('Hello world!');
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.