sept 16

Dans la série IE6 voici 3 différentes manières de cibler IE6 dans votre code CSS:

  1. Avec le !important :
    La clause !important est comprise par tous les navigateurs sauf IE6 et elle permet de donner la priorité à une instruction même si elle est redéfinie par la suite. Dans l’exemple ci-dessous l’ objet d’identifiant « test » sera vert dans tous les navigateur et rouge sous IE6.

    1
    2
    3
    4
    
     #test{
         background-color:green !important;
         background-color:red;
     }
  2. En semant IE6 avec des sélecteurs trop compliqués pour lui:
    IE6 ne lira pas les sélecteurs trop compliqués comme « #test[id]« . Dans l’exemple ci-dessous l’ objet d’ identifiant « test » sera rouge dans tous les navigateur et vert sous IE6.

    1
    2
    3
    4
    5
    6
    
     #test{
         background-color:green;
     }
     #test[id]{
         background-color:red;
     }
  3. Avec les commentaires conditionnels :
    Les commentaires conditionnels doivent être insérés dans votre code HTML et permettent ici de restreindre certaines instructions CSS à IE6.Dans l’exemple ci-dessous l’ objet d’ identifiant « test » sera rouge dans tous les navigateur et vert sous IE6.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    
     <style>
         #test{
             background-color:red;
         }
    </style>
    <!--[if IE 6]>
     <style>
         #test{
             background-color:green;
         }
    </style>
    <![endif]-->

A vous maintenant d’ appliquer ces exemples à vos problèmes.

N’ oubliez pas que l’ordre des instructions CSS est bien sûr important et que le doctype l’est aussi, comme celui-ci par exemple:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Et n’oubliez pas non plus..la lutte continue ;-)

campagne-stop-ie6

Post to Twitter Twitter ce post


mar 02

Voici un “cheat sheet” ou mémo CSS pour vous aider dans vos longues heures d’intégration XHTML/CSS.
cheat-sheet-css-memo-antiseche
Et en voici un 2ème.

Post to Twitter Twitter ce post

fév 12

Le site Cssglobe nous apprends comment créer de jolis graphiques en pur CSS ( et HTML bien sûr), ouioui c’est possible…et assez simple, en voici l’exemple ci-dessous :
graphiques-pur-css
Lien vers l’article.

Exemples.

Post to Twitter Twitter ce post

jan 26

Dans le même style que stripe generator , Tartan maker vous permet de créer vos fonds à carreaux grâce à quelques clicks et glissements de bouton. Pensez de temps en temps à prévisualiser votre création en cliquant sur « Make It » qui apparait sur l’image à chaque modification de paramètre(espacement et couleur) .

Créez vos fonds à carreaux avec Tartan Maker

Créez vos fonds à carreaux avec Tartan Maker

Tartan Maker propose aussi une galerie qui vous permet de visualiser et de télécharger les Fonds déjà créées par cet outils.

Post to Twitter Twitter ce post

jan 26

Si vous souhaitez ajouter une petite touche « Web 2.0″ à votre design avec un fond à rayures, ce générateur est pour vous! Stripe generator vous permet de créer de toute pièce un fond sans raccord pour votre graphisme( couleurs, espacements, orientation des rayures, et ombres portées).

Fonds à rayures avec Stripe Generator

Fonds à rayures avec Stripe Generator

Le site offre aussi une galerie de fonds déjà réalisés.

Post to Twitter Twitter ce post

jan 25

Vous cherchez un bon motif pour le fond de votre site internet? Voici un TRES bon lien avec plus de 1000 motifs ou textures gratuites! …http://patterns.ava7.com

Galerie de Motifs ou Textures

Galerie de Motifs ou Textures

Post to Twitter Twitter ce post