Affichage des icônes et du texte sur la même ligne

Je vais essayer d'obtenir le texte (à la Maison, Sur Nous, Fromage,...), etc pour afficher à droite des icônes de médias sociaux, de sorte que la base du texte est aligné avec la base des icônes et qu'ils apparaissent sur la même ligne.

Comment puis-je faire cela?

Mon code est dans le violon ici http://jsfiddle.net/pnX3d/

    <div class="grid_5" id="social_icons">
        <a href="http://www.facebook.com/print3dexpert" target="blank"><img src="img/facebook.png" alt="Click to visit us on Facebook"></a>
        <a href="http://www.twitter.com/print3dexpert" target="blank"><img src="img/twitter.png" alt="Click to visit us on Twitter"></a>
        <a href="http://pinterest.com/print3dexpert" target="blank"><img src="img/pinterest.png" alt="Click to visit us on Pininterest"></a>
        <a href="#"><img src="img/email.png" title="Click to contact us" alt="Contact us"></a>

    </div>

    <nav class="topmenu omega">
        <ul>
        <li><a href="#">Home</a> |</li>
        <li><a href="#">About Us</a> |</li>
        <li><a href="#">Cheeses</a></li>
        </ul>
    </nav>
Placer l'icône dans un span à l'intérieur de la li.
A ma réponse travaillé?

OriginalL'auteur Dano007 | 2013-09-14