Style H1 du CSS non pris en compte

[katmars]

Bonjour,

J'ai beau tourner le problème dans tous les sens, je n'y comprend rien. Je créé un style H1 dans le CSS, je l'applique dans le code php, le code source html généré semble ok et pourtant le style du H1 n'est pas celui definit dans le css mais le style par défaut du navigateur.

Dans le CSS :

H1.recherche {FONT-SIZE: 11px;color: #FFFFFF; FONT-FAMILY: Arial, sans-serif; TEXT-DECORATION: none; font-weight:bold; line-height:100%;}

Dans le code php :

{ $lgd="<h1 class=\"recherche\">".substr($str_src,0,30)."</h1> - résultat de la recherche";}

Code source du html généré :

<td width=368 class=barre_top valign=bottom align=center>

<h1 class="recherche">test</h1> - résultat de la recherche<br>

</td>

Notre variable $lgd est bien imprimée (avec la valeur test pour $str_src), on a bien les balises H1, mais "test" s'imprime en énorme au lieu d'utiliser la propriété de 11px.

Quelqu'un a t-il déjà fait face à ce cas de figure et a t-il réussi à le résoudre ?

D'avance merci.

Sylvain

[Portekoi]

Ton code fonctionne chez moi

Y a rien au dessus qui pourrais poser problème?

Met des guillements autour de tes arguments...

Là je vois po

[Sarc]

Salut

Il nous faut voir la feuille de style entière pour trouver le problème... Tu dois avoir un autre truc qui agit sur ton style

Par contre, dans ta feuille de style, mets tout en minuscules, ça sera déjà ça de fait...

[katmars]

Salut

Il nous faut voir la feuille de style entière pour trouver le problème... Tu dois avoir un autre truc qui agit sur ton style

Par contre, dans ta feuille de style, mets tout en minuscules, ça sera déjà ça de fait...

<{POST_SNAPBACK}>

Voici le css dans son ensemble... désolé il est un peu long :

@charset "iso-8859-1";

body {margin-top:0;margin-bottom:0; margin-left:0; margin-right:0; background:#FFCCFF}

h1.recherche {font-size: 11pt; color: #FFFFFF; font-family: Arial, sans-serif; text-decoration: none; font-weight:bold; text-align:left;}
P {font-family: Arial, Verdana,  sans-serif ; font-size:11px; line-height: 140%;  color:#003366;}
td {font-family: Arial, Verdana,  sans-serif ; font-size:11px; line-height: 120%; color:#003366; }

A {font-family: Arial, Verdana,  sans-serif ; font-size:11px; line-height: 120%; }
A:hover {text-decoration:none;}

.menu_cat  {font-family: Verdana, Arial, sans-serif;text-decoration:none;font-size:11px; line-height: 140%; font-weight:bold; text-align:left; color:#003366;}
.menu_cat_adu  {font-family: Verdana, Arial, sans-serif;text-decoration:none;font-size:11px; line-height: 140%; font-weight:bold; text-align:left; color:#CC0033;}
.menu_cat:hover  {font-family: Verdana, Arial, sans-serif;text-decoration:none; font-size:11px; line-height: 140%; font-weight:bold; text-align:left; color:#FFFFFF;}
.menu_cat_on  {font-family: Verdana, Arial, sans-serif;text-decoration:none; font-size:11px; line-height: 140%; font-weight:bold; text-align:left; color:#FFFFFF;}

.menu_adu  {font-family: Verdana, Arial, sans-serif; text-decoration:none; font-size:11px; line-height: 130%; font-weight:bold; text-align:left; color:#CC0033;}
.menu_adu:hover  {font-family: Verdana, Arial, sans-serif;text-decoration:none; font-size:11px; line-height: 130%; font-weight:bold; text-align:left; color:#FFFFFF;}
.menu_adu_on  {font-family: Verdana, Arial, sans-serif;text-decoration:none; font-size:11px; line-height: 130%; font-weight:bold; text-align:left; color:#FFFFFF;}


select { font-size:11px; line-height: 140%;}
input {  font-size:11px; line-height: 140%;}
textarea {font-family: Arial, Verdana,  sans-serif ;  font-size:11px; line-height: 140%;}

.small {font-family: Arial, Verdana,  sans-serif ; font-size:8pt; line-height: 12pt; color:#003366; }
.s7 {font-family: Arial, Verdana,  sans-serif ; font-size:7pt; line-height: 10pt; color:#003366; }

.cen {text-align:center;  }
.lft {text-align:left;  }
.rgt {text-align:rgt;  }

ul {font-family: Arial, Verdana,  sans-serif ; list-style-position:outside; font-size:11px; line-height: 140%;}
ul.square {list-style-type: square;}
ul.circle {list-style-type: circle;}
ul.disc {list-style-type: disc;}
ul.none {list-style-type: none;}
ol {font-family: Arial, Verdana,  sans-serif ; list-style-type: lower-alpha; list-style-position:outside; font-size:11px; line-height: 140%;}
ol.dec {list-style-type: decimal;}
ol.urom {list-style-type: upper-roman;}
ol.ualp {list-style-type: upper-alpha;}

.titre {color:#000000; font-size:11px ; font-weight:bold; letter-spacing:0.5px;line-height: 120%; }
.titre_big_list {font-family: Verdana, Arial,  sans-serif ;color:#000000; font-size:12px ; font-weight:bold; letter-spacing:0px; line-height: 140%; }
.titre_big {font-family: Verdana, Arial,  sans-serif ;color:#000000; font-size:16px ; font-weight:bold; letter-spacing:1px; line-height: 140%; }
.soustitre {color:#999999; font-size:11px ; font-weight:normal; letter-spacing:0px;line-height: 120%; }
.noir {font-family: Verdana, Arial, sans-serif ; color:#000000; font-size:10px ; font-weight:normal; letter-spacing:0px;line-height: 140%; }
.noirsmall {color:#000000 ; font-family:Verdana ; text-decoration : none; font-size:10px ; font-weight:bold; letter-spacing:0px;line-height: 100%; }

.prix_big_whitebg {font-family: Verdana, Arial, sans-serif ;color:#009900; font-weight:bold; font-size:18px ; letter-spacing:0px;line-height: 160%; }
.prix_big {font-family: Verdana, Arial, sans-serif ;color:#009900; font-weight:bold; font-size:20px ; letter-spacing:1px;line-height: 140%; }
.prix {font-family: Verdana, Arial, sans-serif ; color:#009900; font-weight:bold; font-size:12px ; letter-spacing:0px; line-height: 100%; }
.prix_bs { color:#FF6600;font-weight: bold; font-size:14px; line-height:24pt;text-align:center;}
.prixsmall {font-family: Verdana, Arial, sans-serif ; color:#009900; font-weight:bold; font-size:10px ; letter-spacing:0px; line-height: 100%; }

.categorie {color:#999999; font-size:9px ; letter-spacing:0px; line-height: 120%; }
.description {color:#666666; font-size:9px ; letter-spacing:0px; line-height: 120%; }
.description_big {font-family: Verdana, Arial,  sans-serif ;color:#000000; font-size:10px ; letter-spacing:0px; line-height: 120%; }
.description_big2 {font-family: Verdana, Arial,  sans-serif ;color:#666666; font-size:10px ; letter-spacing:0px; line-height: 120%; }

.cen {text-align:center;}
.rgt {text-align:right;}
.em {font-weight: bold; font-size:12px; line-height:140%; color:#77A8DF;}
.em2 {FONT-FAMILY: Arial, sans-serif;font-weight: bold; font-size:16px; line-height:140%; color:#FF8040;}
.black18b {FONT-WEIGHT: bold;FONT-SIZE: 18px;COLOR: black;FONT-FAMILY: Arial, sans-serif ;}
.black14{FONT-SIZE: 14px;COLOR: black; FONT-FAMILY: Arial, sans-serif; TEXT-DECORATION: none}
.white14{FONT-SIZE: 14px; COLOR: #FFFFFF; FONT-FAMILY: Arial, sans-serif; TEXT-DECORATION: none}
.white14b{FONT-SIZE: 14px; font-weight: bold; COLOR: #FFFFFF; FONT-FAMILY: Verdana, sans-serif; TEXT-DECORATION: none}

.barre_bot {FONT-SIZE: 12px;color: #FFFFFF; FONT-FAMILY: Arial, sans-serif; TEXT-DECORATION: underline; font-weight:bold; text-align:center; line-height:100%;}
.barre_bot_on {FONT-SIZE: 12px;color: #FFFF66; FONT-FAMILY: Arial, sans-serif; TEXT-DECORATION: none; font-weight:bold; text-align:center; line-height:100%;}
.barre_bot:hover {FONT-SIZE: 12px;color: #FFFF66; FONT-FAMILY: Arial, sans-serif; TEXT-DECORATION: none; font-weight:bold; text-align:center; line-height:100%;}
.barre_top {FONT-SIZE: 11px;color: #FFFFFF; FONT-FAMILY: Arial, sans-serif; TEXT-DECORATION: none; font-weight:bold; text-align:left; line-height:100%;}

.wem {color:#FFFFFF;font-weight: bold; font-size:12px;}
.w {color:#FFFFFF;}

.popup 
{
    color:#000000;
    font-size:7pt;
	text-decoration : none;
	font-family:verdana;
} 

.popup:hover
{
    color:#000000;
    font-size: 7pt;
	font-weight:bold;
	text-decoration : underline;
	font-family: verdana;
} 

Info supplémentaire (mais à mon avis non pertinente), le site est seul sur un serveur dédié OVH.

Sylvain

[Dudu]

Quel est le navigateur utilisé ?

Safari ne style aucun <h*> lorsqu'il est en quirks mode, il me semble.

[Sarc]

Dans ta feuille de style je vois 11pt et non 11px... Les points sont plus gros que les pixels non ? Mets déjà en px lol

Ta feuille de style demande à être un peu optimisée, là il est possible que des styles se marchent dessus... Regroupe un peu le tout

As tu une URL en fait ?

[Dudu]

Çà m'étonnerait que 2 styles se chevauchent entre eux: il n'y a aucun autre h1 dans la CSS. Tu peux quand même vérifier en mettant une déclaration générique aux <h1> (en haut du code CSS).

Sinon essaie peut-être .recherche h1

Si çà ne marche toujours pas, c'est peut-être dans ton code html que çà foire. Et sans vouloir te vexer, çà ne m'étonnerait pas: les 2 lignes HTML que tu as cité sont par exemple quasi absentes de guillemets:

<td width=368 class=barre_top valign=bottom align=center>
<h1 class="recherche">test</h1> - résultat de la recherche<br>
</td>
[right][snapback=104543][/right]

En tous cas, sarc a raison sur une optimisation de la feuille. Par exemple, ne répète pas le "font-family: verdana" toutes les 2 lignes, il alourdit le code pour rien

PS: m'étonnerait aussi que ce soit les pt et les px qui se tapent dessus.. bien que le pt soit déconseillé pour une visualisation écran, il n'en reste pas moins que cette unité est tout à fait reconnue par les navigateurs.

[Xavier]

Sinon essaie peut-être .recherche h1

Non, ça ça va sélectionner les h1 contenu dans un bloc de class="recherche" (<* class="recherche">...<h1>...</h1>...</*>).

Pour les pt normalement ce sont des unités à réserver à l'impression il me semble (Ça vaut 1/72è de pouce, et la taille sera très très différente en fonction de l'écran).

Pour moi il y a clairement un problème ailleurs dans la page. Si tu pouvais l'enregistrer et la mettre en ligne quelque part je suis sur que ça simplifierait la recherche des erreurs possibles