JSFiddle - React, Tailwind, and code Playground
HTML
<!doctype html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if IE 9]> <html class="no-js ie9 oldie" lang="en"> <![endif]-->
<!--[if gt IE 9]><!--> <html class="no-js" lang="fr"> <!--<![endif]-->
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>koskoz.Blog</title>
<link href='http://fonts.googleapis.com/css?family=Droid+Sans|Vollkorn' rel='stylesheet'>
</head>
<body>
<div id="container">
<header id="header">
<hgroup>
<h1><a href="#">Prénom Nom</a></h1>
<h2><a href="http://localhost/wordpress">Le blog</a></h2>
</hgroup>
</header>
</div>
</body>
CSS
#container {
width: 960px;
margin: 0 auto;
overflow: hidden;
}
#header {
position: relative;
margin: 100px 0 65px 0;
}
#header hgroup {
width: 320px;
}
#header h1 a:after, #header h2 a:after {
content: "";
display: inline-block;
width: 100%;
line-height: 0;
font-size: 0;
visibility: hidden;
}
#header h1, #header h1 a {
font-family: 'Droid Sans', serif;
font-size: 38px;
text-align: justify;
text-decoration: none;
color: #000;
}
#header h2, #header h2 a {
margin: 0;
font-family: 'Vollkorn', serif;
font-size: 100px;
text-align: justify;
text-decoration: none;
color: #9f0101;
}