Discussion :

[nicoaix]

Bonjour,
Je voudrais savoir s'il est possible d'utiliser une variable dans un fichier css. Je m'explique. Je souhaite positionner plusieurs éléments d'une page, les uns au dessus des autres. Ils sont tous espacés de 30px. Au lieu de mettre:
.element1{
top:20px;
}
.element2{
top:50px;
}
.element3{
top:80px;
}
....
serait-il possible de faire quelque chose dans ce genre:
var x=30;
var debut=20;
.element1{
top:debut px;
}
.element2{
top:debut+x px;
}
.element3{
top:debut + 2*x px;
}
.....
Ca me permettrait lorsque je souhaite tout décaler de 15 px vers le bas d'avoir à modifier chacun des élément.

Merci.

[Er3van]

Non.
CSS n'est pas un langage de programmation à l'instar d'HTML.

En revanche, tu peux faire ça en PHP à l'affichage :

Code PHP :

Sélectionner tout - Visualiser dans une fenêtre à part

<?php echo 'style="top:'.$maVar.';" ?>

Ou alors avec du JS ?

[nicoaix]

Effectivement j'ai pensé à php mais ça m'impose de transformer mon fichier en php...ok c'est pas grand chose mais je trouve juste pas ça très propre d'un point de vue organisation car je mélange des fichiers de type css avec des fichiers php...
Mais, bon, s'il n'y a pas d'autre solution je vais faire comme ça.

Merci.

[franculo_caoulene]

Salut,

Si tu utilises top, c'est que tu utilises un positionnement. Est-ce vraiment nécessaire? Des éléments non positionnés avec des margin adéquats pourraient éventuellement faire l'affaire.

[nicoaix]

J'utilise 'top' pour aligner les éléments de mon formulaire les uns aux dessus des autres de manière à les aligner parfaitement. De plus je les alignes sur un tableau html en fond de page.
Je ne sais pas si c'est la meilleure manière de faire mais c'est la seule que j'ai trouvé pour le moment. J'ai essayé d'aligner les éléments avec un tableau html mais c'est pas pratique du tout et en plus ça ne produit pas les alignements que je souhaite.

[Er3van]

car je mélange des fichiers de type css avec des fichiers php...

Euh, pourquoi tu mélangerais CSS et PHP ?

Ta partie PHP est dans ton fichier .php, ton css reste dans ta feuille de style externe .css.

C'est à la place de ton .htm(l) que tu auras ton .php, tu ne changes rien à ton organisation. Et t'as juste à le renommer, rien de bien compliqué !

[nicoaix]

Ce que je veux dire c'est que dans mon organisation j'ai un répertoire css dans lequel je mets tous les fichiers de type css que j'utilise. de même j'ai un répertoire javascript pour tous les fichiers js, etc...
Et là du coup j'ai dans mon répertoire css un fichier de type .php contenant en majeure partie du css. De plus en faisant ça, sur dreamweaver la coloration syntaxique du css et l'autocomplétion du code css ne fonctionne plus si je mets une extension .php.
Mais c'est pas grave je fais avec (ou plutot sans...).

[Er3van]

Mettre dans des dossiers c'est bien beau, mais en pratique c'est source de bcp de problème.
Notamment en PHP quand tu dois faire des redirections, ou à partir de formulaires HTML...

Néanmoins, pourquoi ton fichier PHP contient-il du css ? Il ne doit contenir que quelques lignes "inlines", rien de plus. Le reste dans être dans une feuille de style externe.

Et la coloration syntaxique dépend de l'extension, mais, généralement tu sépares tes couches affichages/traitement, donc le problème ne se pose pas. Et pour le peu de coloration qu'il y a en CSS...

[nicoaix]

Ce n'est pas exactement mon fichier php qui contient du css mais plus précisément la feuille de style css qui contient du php. Ceci est la seule manière que j'ai trouvé pour utiliser des variables dans le code css (la raison de cette utilisation est décrite dans mon 1er message).

L'organisation de mes fichiers est la suivante:
1 page php/html contenant un formulaire (et le code php de traitement)
1 ou plusieurs liens vers des pages css (<link rel="stylesheet" type="text/css" media="screen" href="css/defaut.css" />). Ces pages sont dans un répertoire intitulé "css".

[Er3van]

C'est l'inverse qu'il faut faire !

Il ne doit pas y avoir de PHP dans ton css !

C'est dans ton .php qu'il y aura du css "inline".
Par exemple :

Code PHP :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<?php echo '<div style="top:'.$var.';">Mon Div</div>' ; ?>

Sinon, avoir plusieurs feuilles de style ça peut être utile à condition que ce soit justifié ( pour chaque navigateur, pour un utilisateur particulier, etc... ).