Extreme CSS typography

Extreme CSS typography can be a real fun. To achieve our goals, we start with a basic markup like this:

<div id="branding">
    <h1>CSS</h1>
    
    <p id="strapline">A world of style</p>
</div>

Then we can specify enormous font sizes, like so:

#branding {
    width: 100%;
    background: #224185 url(img/brand.jpg) no-repeat top right;
}

#branding h1 {
    font: 17em Impact, sans-serif;
    color: #fff;
    margin: 0;
    padding: 20px 460px 20px 20px;
}


#strapline {
    margin: 0;
    padding: 20px;
    color: #224185;
    font: 6em Georgia, serif;
    background: #fff;
    text-align: center;
}

As you can see, we've used 17em and 6em, respectively. You can find the final result here.