28218 sujets

CSS et mise en forme, CSS3

Bonjour
Tout d'abord, bonjour à tous. J'ai découvert hier ce site et donc ce forum. Bien que mes orientations soient plus Visual Basic 6 et c#, j'utilise un peu HTML, les CSS, PHP..., et je crois que ce site va m'être d'une grande utilité.
Je me suis largement inspiré de Comment contrôler et modifier l'apparence d'une infobulle ? présenté dans la FAQ. Je rencontre un petit problème: je n'arrive pas à définir le style du "titre" dans les feuilles de style et suis donc obligé de le définir comme suit
:<A CLASS="info" HREF="#" STYLE="Color:#000000; font-family: Verdana, Arial, Helvetica, sans-serif; font-size:10 pt; font-weight:600; text-align:left; text-decoration:none">Immobilisations<div><?echo($Aide)?></div></a></font></td>

Il me semble que ces propriétés devraient pouvoir être opérant dans l'une des CSS présentées, ce qui n'est pas le cas. J'ai par exemple essayé de définir la propriété text-decoration:none dans chacune des css, ne voulant pas de titre souligné, mais le "lien" reste toujours, alors que défini directement dans le code comme ci-dessuis, j'arrice à mes fins.
Qu'est-ce que j'ai manqué?
Merci.
Modifié par jacma (14 May 2005 - 17:57)
Administrateur
Salut Jacma et bienvenue ici.

Pour commencer, ton lien <a> contient un élément de type bloc <div>, ce qui n'est pas valable et peut poser des problèmes.

Ensuite, pourrais-tu éviter de placer tes styles directement dans la balise ? Ton lien possède déjà la classe "info" : profites-en pour y passer tes styles, ça évitera d'avoir des styles à plusieurs endroit.

Puis, attention à "font-size:10 pt" : les unités (ici pt) doivent être collées à la valeur, donc tu dois écrire "font-size:10pt". Sinon cette propriété et les suivantes peuvent ne pas être interprétées.

Pour finir : que fait cette balise <font> ? Théoriquement son usage est inutile puisque ta police est définie dans la balise <a> (ou alors dans le paragraphe qui est censé l'entourer). Pire, cette balise <font> risque d'interférer dans tes styles CSS.

Corrige le code selon ces indications et montre-nous ce que ça donne. On y verra plus clair Smiley smile

PS : tu parles plusieurs fois de "titre" dans ton message, or je ne vois pas de balise représentant un titre dans ton code. Est-ce que ton code est incomplet ?
Modifié par Raphael (14 May 2005 - 10:08)
Raphael a écrit :
Pour commencer, ton lien <a> contient un élément de type bloc <div>, ce qui n'est pas valable et peut poser des problèmes.
Je pense que l'élément <div> tient un rôle similaire que l'élèment <span> de l'exemple de la FAQ http://forum.alsacreations.com/faq/#item11. Ceci étant, je ne me rappelle plus vraiment comment le <span> s'est vu transformé en <div>, la seule explication étant que j'ai eu un exemple similaire avec <div>... Smiley ohwell


a écrit :
Ensuite, pourrais-tu éviter de placer tes styles directement dans la balise ? Ton lien possède déjà la classe "info" : profites-en pour y passer tes styles, ça évitera d'avoir des styles à plusieurs endroit.
C'est bien là l'objet de ma question. Mais j'ai essayé d'inclure les mises en formes voulues dans les css (toutes, comme celà, j'étais sûr que c'était placé dans la css adéquate), mais sans réultat. Seule le style dans le code est opérant. Je me suis donc planté quelque part, mais je ne sais où?


a écrit :
)Puis, attention à "font-size:10 pt" : les unités (ici pt) doivent être collées à la valeur, donc tu dois écrire "font-size:10pt". Sinon cette propriété et les suivantes peuvent ne pas être interprétées.
OK, c'est fait.


a écrit :
Pour finir : que fait cette balise <font> ? Théoriquement son usage est inutile puisque ta police est définie dans la balise <a> (ou alors dans le paragraphe qui est censé l'entourer). Pire, cette balise <font> risque d'interférer dans tes styles CSS.
C'est là encore le problème! Sans cette balise, ce que j'appelle "titre" (c'est le texte affiché) reste affiché en bleu, souligne, très petits caractères... enfin tout ce que je ne veux pas Smiley smile


a écrit :
Corrige le code selon ces indications et montre-nous ce que ça donne. On y verra plus clair Smiley smile
Je pense avoir déjà essayé tout celà avant de poster Smiley cligne Mais je vais revoir...
a écrit :
PS : tu parles plusieurs fois de "titre" dans ton message, or je ne vois pas de balise représentant un titre dans ton code. Est-ce que ton code est incomplet ?
Comme dit précédemment, c'est le texte qui s'affiche sur la page (attention, pas dans la bulle) et sur le passage duquel la bulle s'affiche. Il était qualifié de "titre" dans l'autre source (que je ne retrouve plus...).
Merci.
Voila. J'ai trouvé. Il manquait simplement une classe dans la css, la classe a.info:visited
Maintenant, le code suivant se suffit à lui-même: plus de style, plus de balise <font>. Bref, celà semble propre.
<A CLASS="info" HREF="#">Immobilisations<div><?echo($aide_immo)?></div></a></td>

Reste peut-être à remplacer la balise <DIV> par la balise <SPAN>, mais est-ce bien utile? D'après ce que j'ai lu, les duex balises ont pratiquement les mêmes fonctionnalités.
Merci.
Administrateur
jacma a écrit :

Reste peut-être à remplacer la balise <DIV> par la balise <SPAN>, mais est-ce bien utile? D'après ce que j'ai lu, les duex balises ont pratiquement les mêmes fonctionnalités.

Non elles sont très différentes dans leur structure : <div> est une balise de type bloc et <span> de type en-ligne.
Or tu ne peux pas imbriquer une balise bloc dans une balise en-ligne comme <a>

Voici un Récapitulatif.
Modifié par Raphael (14 May 2005 - 18:03)
Merci. Fort utile la récap. Et très claire.
Un dernier point: si je remplace mes balises <DIV> par des balises <SPAN>, faufra-t-il modifier les styles a.info div et a.info:hover div en, respectivement a.info div et a.info:hover span?
En tout cas, pour l'instant, si tu veux voir le résultat, pour lequel tu m'a beaucoup aidé, tu peux aller voir http://gestinfo.fr/static.php?op=simulbilan.php&npds=1 et passer sur les en-têtes des lignes de la table.
Merci