Organisation des .css

Bonjour,

Je voulais savoir comment vous organiser vos fichier .css

Par exemple,

/* =============== F O N T  S I Z E  ================ */
a {font-size:1em;}
a.test {font-size:1.2em;}
a.test1 {font-size:1.4em;}

/* =============== C O L O R  ================ */
a {color:#fff;}
a.test {color:#000;}
a.test1 {color:#ccc;}

ou bien quelque chose du genre...

a {color:#fff; font-size:1em;}
a.test {color:#000; font-size:1.2em;}
a.test1 {color:#ccc; font-size:1.4em;}

Pour l'instant j'ai plusieurs page .css, avec un script .php, j'ai créer un fichier Font-size.css, qui me sort tous les font-size de mes pages .css et les mets dans un fichier.

Ce qui ma foi, me donne un fichier de 130 ligne....

c'est assez bordélique

span.infoBoite {font-size:1.1em;}
p.attention {font-size:1.2em;}
p.nbSpam {font-size:1.1em;}
p.raison {font-size:1.1em;}
p.contenuMessage {font-size:1em;}
...

utiliser vous un truc pour indiquer sur quel page est tel ou tel balise ?

j'ai lu quelque part, une personne qui mettait un id différent au body de chaque page et qui dans son css devait déclarer quelque chose du genre :

body #Accueil a {...}

vous en pensez-quoi ?
Modifié par Sylvain245 (11 Jan 2011 - 15:52)

<!--
Please delete me
-->

Modifié par joska (11 Jan 2011 - 22:32)

Juste pour info. multiplier les fichiers css multiplie aussi les requetes que le navigateur fait au serveur.
Il vaut mieux que tu combines les fichiers css.
Il y a une solution qui consiste à creer ta feuille de style en php ce qui te permet d'utiliser des variables. N'oublie pas d'ajouter

header( 'content-type: text/css' );
session_start();

Sinon pour l'organisation.
en premier le reset
ensuite le design général des typos
ensuite le layout général (grid etc...)
Le menu aussi bien à part
ensuite je ne classe pas par type de propriété mais dans l'ordre du markup html.
En gros je commence par le général et ensuite le spécifique.
Il y a beaucoup de discussion à ce sujet. Je pense que la réponse varie selon le projet et la personne qui le réalise.
A ma connaissance il n'y a pas de "best pratice", le plus pratique d'après ce que j'ai vu à droite et à gauche, c'est l'ordre d'apparence. Selon les cas tu peux avoir besoin de centraliser certaines propriétés. Donc tout dépend du site.

Si jamais tu as des propriétés qui se répètent dans beaucoup d'éléments ça peut être intéressant de créer un class (type .box-shadow ou .gradient etc ...).
Mais autant que possible évite d'intégrer des éléments de design dans le html.

Le sujet est intéressant, je suis curieux de savoir comment font les autres.
Modifié par joska (11 Jan 2011 - 16:32)