Alors alors...
Encore un truc merveilleux en CSS dont j'ignorais totalement l'existence :)
Le but de l'opération est d'adapter le design du site dynamiquement et automatiquement, comprenez sans intervention de l'utilisateur, en fonction de la résolution d'affichage...

L'idée est de proposer un affichage adapté au terminal qui consulte votre site et ce, sans redirection, sans rechargement de la page...Juste en CSS ou en Javascript pour les maudits :)
(je précise au cas où que la solution full-CSS fonctionne très bien, et que ce n'est pas un hack à deux balles)
Donc si un visiteur arrive sur votre site avec une résolution merdique, dû par exemple au fait qu'il utilise un smartphone pour surfer sur votre superbe site qui ne s'affiche bien que sur votre 28 pouces WideScreen NasaEngineer'sChoice :)...bah il ne vous reste plus qu'à implémenter ça :
<link rel='stylesheet' media='screen and (min-width: 701px) and (max-width: 900px)' href='css/medium.css' />


Ou ça en Javascript/JQuery :

<link rel="stylesheet" type="text/css" href="main.css" />
<link id="size-stylesheet" rel="stylesheet" type="text/css" href="narrow.css" />

function adjustStyle(width) {
    width = parseInt(width);
    if (width < 701) {
        $("#size-stylesheet").attr("href", "css/narrow.css");
    } else if  {
        $("#size-stylesheet").attr("href", "css/medium.css");
    } else {
       $("#size-stylesheet").attr("href", "css/wide.css");
    }
}

$(function() {
    adjustStyle($(this).width());
    $(window).resize(function() {
        adjustStyle($(this).width());
    });
});




Ou encore la version full-JS implémenté par un fou il y a de ça quelques années déjà :
http://particletree.com/features/dynamic-resolution-dependent-layouts/


Voici la source :
http://css-tricks.com/resolution-specific-stylesheets/

Et une fois encore merci à Thoams !