Page 1 sur 3

[résolu] L'éditeur CSS ne prend pas les modifs de police

Publié : 12 févr. 2006, 23:53
par Michel Aix
J'ai fait un cadre dans lequel j'avais spécifié une police moyenne, dans une classe .menu_lateral.

Voulant réduire ce menu j'ai entré dans l'éditeur CSS une taille de 10 px et une hauteur de ligne. Cela s'est modifié en temps réel dans la fenêtre affichage normal.
Puis j'ai voulu changer la taille, et là rien ne se passe: l'éditeur prend ce que je lui donne et le conserve mais rien ne change dans l'affichage ni dans le code qui ignore ces valeurs. Voici le code:

Code : Tout sélectionner

<div style="position: fixed; background-color: rgb(255, 204, 153); width: 170px; top: 160px; left: 0px;" class="menu_lateral">
<p><a href="index.html">&nbsp;Accueil</a></p>
<p>&nbsp;<a href="Qui_sommes_nous.html">Qui sommes-nous ?</a></p>
<p>&nbsp;<span style="font-weight: bold;">Que faisons-nous ?</span></p>
<p>&nbsp;O&ugrave; nous contacter</p>
<p>&nbsp;Nos publications</p>
<p>&nbsp;Nos actions</p>
</div>
Un bug ? La classe n'est pas le bon truc pour faire mon menu ? Mais pourquoi le changement de police a marché une fois ?
Je précise que je suis débutant dans ce domaine.

Nvu 1.0 fr sous Tiger

Publié : 13 févr. 2006, 07:58
par Ymai
Ca ne résout rien, mais ça peut consoler...
Ce genre de phénomène m'arrive régulièrement avec les épaisseurs des bordures.
A ce jour, je ne suis pas arrivé à reproduire les conditions précises dans lesquelles cela se produit: une fois ça va, une fois ça ne va pas.
Fermer l'éditeur et y retourner permet parfois de résoudre. Ou alors supprimer temporairement la règle et la reconstruire.

Publié : 13 févr. 2006, 08:05
par Do-IT
Adresse de la page ?
Sinon fait voir la source de la feuille de style.
Tu as essayé l'excellent extension KaZcadeS ? (qui améliore l'editeur css de nvu).
Tu arrives a reproduire le bug ?

position:fixed marche pas avec IE (rien a voir avec ton bug)

Publié : 13 févr. 2006, 09:18
par Kazé
Une classe, c'est très bien adapté à ton menu.
Lapalissade : si tu utilises une classe pour modifier l'apparence de ton menu, il faut modifier la police pour cette classe "menu_lateral". Le code sera alors modifié dans la feuille de style correspondante (incorporée ou liée), et non dans le code HTML de ton menu...
Donc, poste-nous l'adresse de ta page (ou son code HTML complet), on pourra mieux t'aider. ;)

@Ymai : je n'ai jamais constaté ce genre de bug sur les polices de caractères. Par contre, pour les bordures, j'ai vu des bizarreries.
Je crois que ça merdouille si on édite une page qui contient une règle CSS "compacte" sur une seule ligne (border: 1px solid blue;) plutôt qu'une liste de règles (comme le fait naturellement Nvu). J'ai arrêté de bricoler KaZcadeS pour l'instant, mais si quelqu'un peut donner les conditions pour reproduire ce bug, qu'il le poste dans ce sujet, je m'y mettrai à l'occasion.

Publié : 13 févr. 2006, 09:18
par chinon37
pour trouver l'éventuel problème, il nous faut le contenu de la feuille de style de la même manière que tu donnes le contenu du menu...

Publié : 13 févr. 2006, 09:29
par Kazé
ADSL - RTC : 1 à 0 :lol:

Publié : 13 févr. 2006, 09:30
par Ymai
Kaze a écrit : @Ymai : je n'ai jamais constaté ce genre de bug sur les polices de caractères. Par contre, pour les bordures, j'ai vu des bizarreries.
Je crois que ça merdouille si on édite une page qui contient une règle CSS "compacte" sur une seule ligne (border: 1px solid blue;) plutôt qu'une liste de règles (comme le fait naturellement Nvu).
Le problème que j'évoque se produit bien en NVU natif, dans l'éditeur CSS Cascades original.

Ayé, je l'ai...
Je suis sur une page vierge et je crée un nouveau style dans Cascades (l'original)
Je passe dans l'onglet "Bordures" et, par vice,
- je commence par choisir l'épaisseur (1px) -> pas de visualisation dans l'Aperçu
- puis seulement le style (plein) -> hop, visualistation d'une bordure noire qui fait nettement plus d'1px
- j'essaie de modifier l'épaisseur: rien n'y fait; elle garde son épaisseur d'origine.

Ayé, je ne l'ai plus.
Je viens de réessayer: maintenant tout est normal.

Confusing, isn't it?

Publié : 13 févr. 2006, 09:47
par Michel Aix
Do-IT a écrit :Adresse de la page ?
Sinon fait voir la source de la feuille de style.
Tu as essayé l'excellent extension KaZcadeS ? (qui améliore l'editeur css de nvu).
Tu arrives a reproduire le bug ?

position:fixed marche pas avec IE (rien a voir avec ton bug)
Oui, je sais que fixed ne marche pas avec IE6 (mais il marche avec IE5 mac !!!)

Voici le texte de la feuille de style.

Code : Tout sélectionner

/* Generated by CaScadeS, a stylesheet editor for Mozilla Composer */

  body { font-family: Arial,Helvetica,sans-serif;
    background-image: url(images/fond_page.gif);
    text-align: left;
    }

  h1 { color: #000000;
    text-align: center;
    font-family: Arial,Helvetica,sans-serif;
    font-size: large;
    line-height: 1cm;
    }

  h2 { font-family: Arial,Helvetica,sans-serif;
    font-weight: bold;
    text-align: left;
    font-size: medium;
    line-height: 0.6cm;
    }

  li { text-align: left;
    font-style: normal;
    font-family: Arial,Helvetica,sans-serif;
    list-style-image: url(Images/puce-verte.gif);
    }

  p { text-align: left;
    font-size: 16px;
    background-color: transparent;
    font-family: Arial,Helvetica,sans-serif;
    }

  .surlignevert { background-color: #339999;
    }

  .surligneviolet { background-color: #cc33cc;
    }

  .surlignejaune { background-color: #ffff00;
    }

  .titre_rouge { text-align: center;
    font-weight: bold;
    color: #ff0000;
    font-size: x-large;
    }

  .menu { font-family: Times New Roman,Times,serif;
    text-align: left;
    font-size: large;
    }

  .div class { border-color: #ff0000;
    border-width: 1px;
    display: table;
    }

  .table_accueil { border: 1px solid #000000;
    }

  .menu_lateral { border: 3px solid #990000;
    font-family: Courier New,Courier,monospace;
    position: fixed;
    width: 6cm;
    line-height: 10px;
    font-size: 10px;
    text-align: center ! important;
    }
Le bug est systématique, je ne peux plus modifier la taille de la police par l'éditeur CSS, il ne mémorise pas, par contre je peux modifier la hauteur de ligne.
L'adresse de la page est http://michel.liger.9online.fr. Le problème est dans le menu de navigation, à gauche.

Non, je n'ai pas KaZcadeS. Est-ce qu'il s'intégre bien avec Nvu ?

Publié : 13 févr. 2006, 09:59
par Ymai
Bug confirmé. J'observe exactement la même chose (Win2k - Cascades original).
Par contre, ça va *un peu* mieux dès que je supprime line-height.

Publié : 13 févr. 2006, 11:17
par Kazé
Confirmé avec KaZcadeS également :

Code : Tout sélectionner

Erreur : elt.oninput is not a function
Fichier source : chrome://cascades/content/commonCssProps.js
Ligne : 1230
A ajouter à la liste des bugs de CaScadeS... :(

Publié : 13 févr. 2006, 11:22
par chinon37
Kaze a écrit :ADSL - RTC : 1 à 0 :lol:
Pourtant dans la même minute: ce qui prouve que les bouseux de la campagne sont des laissés pour compte :cry:

Publié : 13 févr. 2006, 11:26
par Kazé
Euh, réflexion faite, avec la fenêtre "propriétés avancées" de KaZcadeS on constate que la hauteur de ligne est définie ailleurs dans ta feuille de style :

Code : Tout sélectionner

  p { text-align: left;
    font-size: 16px;
    background-color: transparent;
    font-family: Arial,Helvetica,sans-serif;
    }
Ton sélecteur .menu_lateral ne s'applique pas aux balises <p> (qui contiennent chaque ligne de ton menu). C'est donc complètement normal (?) que la taille de la police ne bouge pas dans ton menu latéral si tu modifies la règle ".menu_lateral".

Pour modifier la taille des polices de ton menu latéral, il faudra utiliser une règle du genre :

Code : Tout sélectionner

.menu_lateral p { font-size: 10px; }
Conclusion : KaZcadeS rules! :P

Publié : 13 févr. 2006, 13:43
par Invité
Kaze a écrit :Euh, réflexion faite, avec la fenêtre "propriétés avancées" de KaZcadeS on constate que la hauteur de ligne est définie ailleurs dans ta feuille de style :

Code : Tout sélectionner

  p { text-align: left;
    font-size: 16px;
    background-color: transparent;
    font-family: Arial,Helvetica,sans-serif;
    }
Ton sélecteur .menu_lateral ne s'applique pas aux balises <p> (qui contiennent chaque ligne de ton menu). C'est donc complètement normal (?) que la taille de la police ne bouge pas dans ton menu latéral si tu modifies la règle ".menu_lateral".

Pour modifier la taille des polices de ton menu latéral, il faudra utiliser une règle du genre :

Code : Tout sélectionner

.menu_lateral p { font-size: 10px; }
Conclusion : KaZcadeS rules! :P
Merci Kaze, tu dois avoir raison. Je vais essayer ce que tu dis. Je reviendrai donner le résultat.

Publié : 13 févr. 2006, 16:11
par Ymai
Kaze a écrit :KaZcadeS rules! :P
J'enrage: je l'avais désinstallé pour pouvoir terminer mon cours sur la mise en page CSS sous NVU natif.

Ca empire. Editeur à jeter ?

Publié : 13 févr. 2006, 19:08
par Invité
Kaze a écrit : Pour modifier la taille des polices de ton menu latéral, il faudra utiliser une règle du genre :

Code : Tout sélectionner

.menu_lateral p { font-size: 10px; }
Conclusion : KaZcadeS rules! :P
Ca ne s'arrange pas. J'ai créé une classe menu_lateral_p comme tu le suggères. Ca marche impec, mais quand je veux changer la règle, la taille de police ou la hauteur de ligne, impossible de changer.

Pire, si j'accède à l'éditeur depuis une autre page qui utilise la même feuille de style, cette dernière règle n'apparait pas, alors que la feuille de style lue dans un éditeur de texte comporte bien ma nouvelle classe.
Si je ferme tout, ma classe apparait dans les 2 pages, mais n'y donne pas la même taille de caractère...

Que faire ? Je jette Nvu, ou du moins son éditeur CSS ? :cry: