28173 sujets

CSS et mise en forme, CSS3

Bonsoir tout le monde Smiley smile .

Voila mon souci, tel que dit dans le sujet de ce post , je pense que safari, dans sa version 2 en tout cas ( pas testé sur la 3 ) n'applique pas la cascade de manière très spécifique sur tout ce qui est une balise HTML.

Je m'explique, imaginons que j'ai une feuille de style principale ( principale.css) qui inclut une autre spécifique a une partie du site ( specifique.css). En dotant BODY d'un ID, je sélectionne ces styles là, qui pour plus de facilité de maintenance , sont regroupés dans specifique.css.

Un peu de code avec ca ? Voilou Smiley lol

Dans principale.css :

 
@import url(specifique.css);

.classe{
color:#FFF
font-weight:bold;
}

h2{
color:red;
}


Dans specifique.css :

 

body#specifique .classe{
color:#FFF
font-weight:bold;
}

body#specifique h2{
color:green;
}


Dans le HTML :

 
....
<body id="specifique">
<p class="classe">
<h2>Mon titre h2</h2>
........



Et bien , je vous le donne en mille ! la classe " classe " est bien interprété mais H2 reste avec le style décrit sur principale.css.
C'est d'ailleurs le cas avec toutes les balises courantes ( p, input, form, select, ....).

Alors est-ce que c'est la feuille incluse qu'il n'aime pas , est ce que c'est le body#specifique h2 ? je ne sais pas trop ....

Évidemment, pour deux lignes de CSS , on pourrait toujours s'arranger mais ma feuille étant ( trop ? Smiley langue ) grosse, évidemment si ca cause à quelqu'un qui a déjà vu ça, et qui sait comment s'en sortir honorablement , je suis preneur !!!

Merci d'avance !

Smiley cligne
Modifié par RoseGrenouille (23 Jun 2007 - 03:27)
Pour commencer, les deux feuilles de style sont valides ?

C'est peut-être une erreur en recopiant le code ici, mais tu as :
.classe{
color:#FFF
font-weight:bold;
}

Il est où le point-virgule pour séparer les deux déclarations ?
Bonjour Florent,

Oui les deux feuilles de styles sont valides, elles fonctionnent sus firefox 1 et 2 ( Mac, linux et PC ), opéra, netscape, iE 5.1 @ 7, et safari en dehors du point qui nous préoccupe.

Noter que l'exemple n'est qu'un exemple et non pas un extrait des feuilles de style concernés ( exemple ou il manque effectivement un point virgule Smiley biggrin )

la feuille spécifique est bien incluse puisque l'ajout d'une classe sans cascade dans cette feuille se traduit effectivement par la modification du rendu dans le navigateur.


Une autre idée ?
Ah oui, dans ton code d'exemple tu as aussi un h2 dans un p (ce dernier n'étant pas refermé). Encore une erreur dans le code d'exemple, je suppose ? Et donc le code HTML de la vraie page (si on pouvait la voir ?) est valide ?