<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="generator" content="CoffeeCup HTML Editor (www.coffeecup.com)">
<meta name="dcterms.created" content="Mon, 15 Jan 2018 00:09:05 GMT">
<meta name="description" content="">
<meta name="keywords" content="">
<title></title>
<style>
body {
margin: 2vh;
background-color: #d7f7f7;
}
.margin-b{margin-bottom: 2vh;}
.wrapper_C4 {
display: grid;
grid-gap: 2vh;
grid-template-columns: 1fr 1fr 1fr 1fr;
background-color: #f7f7f7;
color: #444;
}
.wrapper_C5 {
display: grid;
grid-gap: 2vh;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
background-color: #f7f7f7;
color: #444;
}
.box {
background-color: white;
color: black;
border-radius: 5px;
padding: 2vh;
font-size: 150%;
}
.thin{height: 7vh; }
.body{height: 66vh; }
.a5-1 {
grid-column: 1 / span 1;
}
.a5-2 {
grid-column: 2 / span 1;
}
.a5-3 {
grid-column: 3 / span 1;
}
.a5-4 {
grid-column: 4 / span 1;
}
.a5-5 {
grid-column: 5 / span 1;
}
.b5-1 {
grid-column: 1 / span 1;
}
.b5-2 {
grid-column: 2 / span 1;
}
.b5-3 {
grid-column: 3 / span 1;
}
.b5-4 {
grid-column: 4 / span 1;
}
.b5-5 {
grid-column: 5 / span 1;
}
.c5-1 {
grid-column: 1 / span 1;
}
.c5-2 {
grid-column: 2 / span 1;
}
.c5-3 {
grid-column: 3 / span 1;
}
.c5-4 {
grid-column: 4 / span 1;
}
.c5-5 {
grid-column: 5 / span 1;
}
.
</style>
<!--[if IE]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body>
<div class="wrapper_C4 margin-b">
<div class="box a5-1 thin">Height 7vh but 2vh padding</div>
<div class="box a5-2 thin">Height 7vh but 2vh padding</div>
<div class="box a5-3 thin">Height 7vh but 2vh padding</div>
<div class="box a5-4 thin">Height 7vh but 2vh padding</div>
<div class="box b5-1 thin">Height 7vh but 2vh padding</div>
<div class="box b5-2 thin">Height 7vh but 2vh padding</div>
<div class="box b5-3 thin">Height 7vh but 2vh padding</div>
<div class="box b5-4 thin">Height 7vh but 2vh padding</div>
<div class="box c5-1 thin">Height 7vh but 2vh padding</div>
<div class="box c5-2 thin">Height 7vh but 2vh padding</div>
<div class="box c5-3 thin">Height 7vh but 2vh padding</div>
<div class="box c5-4 thin">Height 7vh but 2vh padding</div>
</div>
<div class="wrapper_C5">
<div class="box a5-1 thin">Height 7vh but 2vh padding</div>
<div class="box a5-2 thin">Height 7vh but 2vh padding</div>
<div class="box a5-3 thin">Height 7vh but 2vh padding</div>
<div class="box a5-4 thin">Height 7vh but 2vh padding</div>
<div class="box b5-1 thin">Height 7vh but 2vh padding</div>
<div class="box b5-2 thin">Height 7vh but 2vh padding</div>
<div class="box b5-3 thin">Height 7vh but 2vh padding</div>
<div class="box b5-4 thin">Height 7vh but 2vh padding</div>
<div class="box c5-1 thin">Height 7vh but 2vh padding</div>
<div class="box c5-2 thin">Height 7vh but 2vh padding</div>
<div class="box c5-3 thin">Height 7vh but 2vh padding</div>
<div class="box c5-4 thin">Height 7vh but 2vh padding</div>
</div>
</body>
</html>
Comments