Created
November 20, 2013 13:09
-
-
Save jieter/7562906 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<head> | |
<style> | |
* { | |
-moz-box-sizing: border-box; | |
-webkit-box-sizing: border-box; | |
box-sizing: border-box; | |
} | |
h1 { | |
width: 404px; | |
margin: 10px auto; | |
clear: both; | |
} | |
.container { | |
clear: both; | |
margin: 10px auto; | |
min-height: 102px; | |
width: 402px; | |
border: 1px solid red; | |
background-color: #fee; | |
} | |
.block { | |
float: left; | |
min-height: 100px; | |
border: 1px solid #aaa; | |
background-color: #eee; | |
padding: 25px 0; | |
font-size: 40px; | |
color: #444; | |
text-align: center; | |
} | |
.block100 { width: 100px; } | |
.block200 { width: 200px; } | |
.block300 { width: 300px; } | |
.block350 { width: 350px; } | |
</style> | |
</head> | |
<body> | |
<h1>Dit past:</h1> | |
<div class="container"> | |
<div class="block block200">200</div> | |
<div class="block block200">200</div> | |
</div> | |
<div class="container"> | |
<div class="block block100">100</div> | |
<div class="block block200">200</div> | |
<div class="block block100">100</div> | |
</div> | |
<h1>Dit past niet:</h1> | |
<div class="container"> | |
<div class="block block200">200</div> | |
<div class="block block300">300</div> | |
</div> | |
<h1>en deze ook niet:</h1> | |
<div class="container"> | |
<div class="block block350">350</div> | |
<div class="block block100">100</div> | |
</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment