JSFiddle - React, Tailwind, and code Playground

by PooLP

HTML

<header id="banner">
    <hgroup>
        <h1 id="logo">
            <a href="/" rel="home"><img src="http://www.poolp.net/wp-content/themes/poolp.net/images/logo.png" alt="Salut, c'est moi : logo!" />
                <span>Salut, c'est moi : logo!</span>
            </a>
        </h1>
        <h2 id="motto">Salut, c'est moi : motto !</h2>
    </hgroup>
</header>

CSS

header {
    background:#00ff00 url(images_entete.png) 0 0 no-repeat; /* image de l'entĂŞte */
    position:relative;
}

hgroup h1 {
    height:178px; /* hauteur du logo */
}

hgroup h1 img {
    background:#ff0000;
    position:relative;
    z-index:2; 
}

hgroup h1 span {
    display:block;
    position:absolute;
    z-index:1; 
    top:0;
}