Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <header>
    <div><h1>Super Bad Super Bad Super Bad Super Bad Super Bad Super Bad Super Bad</h1></div>
    <nav>
        <a>First Link</a>
        <a>Second Link</a>
        <a>Third Link</a>
    </nav>
  </header>
</body>
</html>
 
@import url(http://fonts.googleapis.com/css?family=Lato:400,700italic);
* { padding: 0; margin: 0; }
body { background: #1abc9c; font-family: 'Lato', sans-serif; text-transform: uppercase; letter-spacing: 1px;}
header {
    text-align: justify;
    height: 15em;
    padding: 2em 5%;
    background: #2c3e50;
    color: #fff;
}
header::after {
    content: '';
    display: inline-block;
    width: 100%;
}
header > div,
header > div::before,
header > div h1,
header nav {
    display: inline-block;
    vertical-align: middle;
}
header > div {
    width: 50%;
    height: 100%;
    text-align: left;
}
header > div::before {
    content: '';
    height: 100%;
}
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x