# Flexbox Fundamentals
_by Garth Braithwaite_
![](https://d2eip9sf3oo6c2.cloudfront.net/series/square_covers/000/000/036/full/EGH_Flexbox.png?1496436393)
Flexbox is a wonderful tool built into the CSS specification. Using flexbox doesn't require any special framework or library, just a browser with CSS3 support. It is so awesome, and makes the arranging elements on a page almost fun!
_Each lesson's code is in its corresponding lesson folder. Plunks are drawn from the lesson's branch._
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>Flexbox Sizing</title>
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,600' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="lib/app.css">
</head>
<body>
<h1 class="title-1">Garth</h1>
<h1 class="title-2">is</h1>
<h1 class="title-3">Rad</h1>
</body>
</html>
body {
margin: 0;
font-family: 'Open Sans', sans-serif;
margin: 0;
color: #eec965;
display: flex;
}
.title-1 {
background: #dd5f40;
}
.title-2 {
background: #3d483a;
}
.title-3 {
background: #468e5d;
}
h1 {
flex-basis: 200px;
flex-shrink: 0;
}