Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1318 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [HTML/JS/CSS] problème avec les styles!!

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[HTML/JS/CSS] problème avec les styles!!

n°247575
k666
dites non à petitmou
Posté le 18-11-2002 à 13:03:29  profilanswer
 

salut,
j'ai un problème avec les css, en effet j'ai un div qui en contien d'autres,
 

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <html>
  3. <head>
  4. <title> New Document </title>
  5. <style>
  6. .over { text-decoration:underline; }
  7. .out { text-decoration:none; }
  8. </style>
  9. </head>
  10. <body>
  11. <div class="over">pouet pouet sousligné
  12. <div class="out">pouet pas sousligné en principe</div>
  13. </div>
  14. </body>
  15. </html>


 
mais la classe out ne s'applique pas :( je sais pas pourquoi, à l'aide siouplé!!!!
 
 
pour mettre un peu plus de piment dans le post, voilà un deuxième exemple:
 

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <HTML>
  3. <HEAD>
  4. <TITLE> New Document </TITLE>
  5. <style>
  6. .over { text-decoration:underline; font-style:italic;}
  7. .out { text-decoration:none; font-style:normal;}
  8. </style>
  9. </HEAD>
  10. <BODY>
  11. <div class="over">pouet pouet sousligné
  12. <div class="out">pouet pas sousligné en principe</div>
  13. </div>
  14. </BODY>
  15. </HTML>


 
ici la première est soulignée et en italique, la seconde ligne est soulignée mais pas d'italique !!!
 
moi ske je veux est que la deuxième soit pas soulignée et pas en italique, mais il la souligne quand même cet abruti de moz et IE !!!! :fou: pourquoi!!!!! à l'aide!!!!!!
 
 
(ancien post incompréhensible ci dessous, ne pas lire)
 
 
j'ai mis que ce div soit de la classe (disons) mover quand je passe ma souris dessus, et les sous div sont de la classe mout à moins que je passe ma souris dessus...
le problème que je rencontre est que la classe du surdiv "piétine" celle des sous div, car les sous div sont aussi soulignés alors qu'ils ne le devraient pas car leur classe contient text-underline:none;
 
si vous pouviez m'aider, à l'url suivante vous trouverez l'exemple:
 
http://pouet.cocomatic.net/meca/meca_nav.html
 
cliquez deux fois sur test avec urls bidon pour voir apparaitre les div,
merci bcp et silvousplait aidez moi :( paske je perds plein de temps et ne vois pas d'ou ça peut bien venir :/
 
 
edit: la popup qui apparait est une fenetre de debogage indiquant les classes de tous les DIV de la page, la calsse qui m'intéresse en particulier est mout et mover, correspondant à non-souligné et souligné


Message édité par k666 le 18-11-2002 à 18:19:31
mood
Publicité
Posté le 18-11-2002 à 13:03:29  profilanswer
 

n°247602
k666
dites non à petitmou
Posté le 18-11-2002 à 14:04:43  profilanswer
 

opeu

n°247647
gm_superst​ar
Appelez-moi Super
Posté le 18-11-2002 à 15:04:30  profilanswer
 

Mmmm je vois pas tellement de solution à part forcer le styles des éléments enfants à .mout...
 
Perso, je trouve vraiment ton menu compliqué... y'a moyen de faire plus simple à grand coup de CSS ce qui réduirait pas mal le JavaScript
 
 
PS: je sais que je me répète mais "/" est interdit dans les id="..."


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°247694
k666
dites non à petitmou
Posté le 18-11-2002 à 15:28:46  profilanswer
 

yaisse je sais pour les interdits :p je sais c cradeau mais ça m'aide à coder paske je vois ça comme des tiroirs , des répertoires plus ou moins !!!
 
je sais quia bcp plus simple à faire, mais je suis obligé de passer par là, car ce menu de navigation doit être controlable par d'autres frames html ou n'importe quelle autre chose,
et je suis aussi obligé d'avoir tous ces différents états,
j'ai dit à la graphiste qu'elle me ponde une css hyper exhaustive et j'ai mis plein d'éléments en commun sur des classes pis je suis donc obligé de faire de la concaténation de classes comme ça pour reconstruire l'aspect souhaité ...
cette page là aura donc bientôt une API de contrôle de la CSS,
 
 
 
je viens de faire l'essai en forçant la classe de (par exemple) /1057/1058/643 et même comme ça il la souligne :( tu sais pas d'où ça peut bien venir ??? :/

n°247696
k666
dites non à petitmou
Posté le 18-11-2002 à 15:33:00  profilanswer
 


/1057/1058/ : level1 a_level1_on click mover
/1057/1058/content/ : mout
/1057/1058/642 : activite mout a_activite_off click
/1057/1058/641 : activite mout a_activite_off click
/1057/1058/643 : mout
 
 
 
en faisant ça, ça reste encore souligné alors que ça devrait pas car le /1057/1058/643 est à mout ainsi que son père /1057/1058/content/ mais son grand père est à mover :( je vois vraiment pas :(:(:(:(

n°247739
gm_superst​ar
Appelez-moi Super
Posté le 18-11-2002 à 16:14:23  profilanswer
 

Tu dois appliquer mout aux enfants après avoir appliqué mover
 
Cela dit j'ai plusieurs questions :  
 
Pourquoi tu appliques onmouseover à un élément qui n'est pas un lien ? (sites et images)
 
Pourquoi tu n'utilises pas l'élément <a> pour les "vrais" liens ?


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°247745
k666
dites non à petitmou
Posté le 18-11-2002 à 16:20:44  profilanswer
 

bin en fait paske en appliquant tout mon style etc... je pourrais vraiment faire comme si c'était des boutons, et par paresse aussi, paske j'aime pas mettre de :hover :link etc... ça me parait relou et je devrai rajouter plusieurs lignes, et paske, aussi, je construis toute la structure de divs depuis une feuille XSL et que je veux que le bazar soit vraiment le plus squelettaire possible :s


---------------
mangez du mozilla c le futur, c votre DESTIN ! http://www.mozilla.org/releases/
n°247747
k666
dites non à petitmou
Posté le 18-11-2002 à 16:22:33  profilanswer
 

sinon, même en l'appliquant après (la classe mout aux childs) ça continue de rester sousligné :'(


---------------
mangez du mozilla c le futur, c votre DESTIN ! http://www.mozilla.org/releases/
n°247820
gm_superst​ar
Appelez-moi Super
Posté le 18-11-2002 à 17:10:24  profilanswer
 

k666 a écrit a écrit :

bin en fait paske en appliquant tout mon style etc... je pourrais vraiment faire comme si c'était des boutons, et par paresse aussi, `paske j'aime pas mettre de :hover :link etc... ça me parait relou et je devrai rajouter plusieurs lignes, et paske, aussi, je construis toute la structure de divs depuis une feuille XSL et que je veux que le bazar soit vraiment le plus squelettaire possible :s



C'est vrai que tes fonctions JavaScript sont beaucoup plus simples. :hover ça a justement été inventé pour ça !
 
Enfin je vois toujours pas l'intérêt de mettre le onmouseover sur les noeuds de tes arbres... car c'est bien eux qui posent problème... Enfin j'ai pas eu le courage de me plonger dans ton truc...
 
Sinon au pire tu peux faire quelque chose comme ça :  
<div><span onmouseover="...">Noeud</span>
  <div>Lien</div>
  <div>Lien</div>
  <div>Lien</div>
</div>


Message édité par gm_superstar le 18-11-2002 à 17:10:53

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°247828
k666
dites non à petitmou
Posté le 18-11-2002 à 17:40:32  profilanswer
 

en fait j'ai le control total sur la navigation si je veux, grace au JS. peut etre par exemple que je veux cacher ou interdire de cliquer sur un noeud en particulier, grace a js je pourrais le faire et d'ailleurs montrer à l'utilisateur, de faàçon graphique , qu'il ny'a pas droit (le fameuse classe pasclick de ma css je crois) ... je suis vraiment obligé de faire comme ça, car en fait ce menu de navigation n'est qu'un satellite d'une api de navigation que je code actuellement, il peut lui envoyer des messages et en recevoir, et dans tous les cas il doit être capable de lire les évènements du menu de navigation et de modifier les classes de celui ci !
 
mais le problème est que je n'arrive pas à maintenir une classe d'un élément quand la classe de l'élément le contenant change ... ici par exemple, j'ai réussi à mieux cibler le problème, l'exemple est complètement simple et fastoche: regardez si vous avez la pèche:
 

http://pouet.cocomatic.net/meca/pb_css.html

 
 
 
 

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <html>
  3. <head>
  4. <title> New Document </title>
  5. <style>
  6. .over { text-decoration:underline; }
  7. .out { text-decoration:none; }
  8. </style>
  9. </head>
  10. <body>
  11. <div class="over">pouet pouet sousligné
  12. <div class="out">pouet pas sousligné en principe</div>
  13. </div>
  14. </body>
  15. </html>


Message édité par k666 le 18-11-2002 à 17:48:15

---------------
mangez du mozilla c le futur, c votre DESTIN ! http://www.mozilla.org/releases/
mood
Publicité
Posté le 18-11-2002 à 17:40:32  profilanswer
 

n°247866
k666
dites non à petitmou
Posté le 18-11-2002 à 18:20:16  profilanswer
 

up voir le premier post du topic, que je viens d e modifier pour embrouiller moins votre esprit :p

n°247873
gm_superst​ar
Appelez-moi Super
Posté le 18-11-2002 à 18:29:38  profilanswer
 

k666 a écrit a écrit :

mais le problème est que je n'arrive pas à maintenir une classe d'un élément quand la classe de l'élément le contenant change ... ici par exemple, j'ai réussi à mieux cibler le problème, l'exemple est complètement simple et fastoche: regardez si vous avez la pèche:
 

http://pouet.cocomatic.net/meca/pb_css.html




Bon en fait c'est logique parce que text-decoration: none; ça veut dire qu'on applique aucune décoration supplémentaire à ton texte. Le problème est que ton texte dans out a déjà une décoration : il est souligné car son conteneur est lui-même souligné. C'est plus ou mois dit dans la spec :
 

Citation :

Quand la propriété est appliquée à un élément de type bloc, elle agit sur tous les descendants de type en-ligne de celui-ci. Quand elle est appliquée à un élément de type en-ligne, ou agit sur celui-ci, cette propriété influence toutes les boîtes générées par cet élément.


 
En fait, je pense que ceux qui ont rédigé les specs des CSS n'ont pas envisagé ce cas (tordu). Donc à toi de trouver une alternative.
 
Tu ne peux pas organiser tes <div> comme je l'ai mis plus haut ?  
<div><span onmouseover="...">Noeud</span>
 <div>Lien</div>
 <div>Lien</div>
 <div>Lien</div>
</div>


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°247878
k666
dites non à petitmou
Posté le 18-11-2002 à 18:34:12  profilanswer
 

gm_superstar a écrit a écrit :

 
En fait, je pense que ceux qui ont rédigé les specs des CSS n'ont pas envisagé ce cas (tordu). Donc à toi de trouver une alternative.




bin je pense sincèrement que c eux les tordus (appliquer une décoration supplémentaire ? comme si il y 'en avait tant que ça :sarcastic: :/) mais bon, je devrai alors faire ça, si compliqué que ça avec des div TITRE et des div CONTENU ? :'(

n°247884
k666
dites non à petitmou
Posté le 18-11-2002 à 18:42:52  profilanswer
 

mais c vrai qu'àforce d'être assis sur une chaise pourrax devant un ordi on devient rapidement tordu :D
 
 
 
(ceci est un up déguisé)

n°248127
k666
dites non à petitmou
Posté le 19-11-2002 à 00:02:09  profilanswer
 

eupe

n°248128
gm_superst​ar
Appelez-moi Super
Posté le 19-11-2002 à 00:04:34  profilanswer
 

Mais tu veux quoi de plus ? T'as essayé la méthode que je te propose ?


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°248177
einstein2
Windaube, FAIS l'EFFORT !
Posté le 19-11-2002 à 06:37:48  profilanswer
 

Salut g testé ton prog, ma conclusion.
 
la première balise div (qui souligne)
s'applique jusqu'à la fermeture par la balise </div>
 
qd tu imbriques une seconde balise g l'impression qu'elle effectue une action EN PLUS!!!!!!!
 
hors l'action c "none" donc il reste bien souligne+none=souligne
 
c un peu confus mais on hérite dans la sous balise div, de tous les text deco des balises div supérieures!
 

k666 a écrit a écrit :

salut,
j'ai un problème avec les css, en effet j'ai un div qui en contien d'autres,
 

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <html>
  3. <head>
  4. <title> New Document </title>
  5. <style>
  6. .over { text-decoration:underline; }
  7. .out { text-decoration:none; }
  8. </style>
  9. </head>
  10. <body>
  11. <div class="over">pouet pouet sousligné
  12. <div class="out">pouet pas sousligné en principe</div>
  13. </div>
  14. </body>
  15. </html>


 
mais la classe out ne s'applique pas :( je sais pas pourquoi, à l'aide siouplé!!!!
 
 
pour mettre un peu plus de piment dans le post, voilà un deuxième exemple:
 

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
  2. <HTML>
  3. <HEAD>
  4. <TITLE> New Document </TITLE>
  5. <style>
  6. .over { text-decoration:underline; font-style:italic;}
  7. .out { text-decoration:none; font-style:normal;}
  8. </style>
  9. </HEAD>
  10. <BODY>
  11. <div class="over">pouet pouet sousligné
  12. <div class="out">pouet pas sousligné en principe</div>
  13. </div>
  14. </BODY>
  15. </HTML>


 
ici la première est soulignée et en italique, la seconde ligne est soulignée mais pas d'italique !!!
 
moi ske je veux est que la deuxième soit pas soulignée et pas en italique, mais il la souligne quand même cet abruti de moz et IE !!!! :fou: pourquoi!!!!! à l'aide!!!!!!
 
 
(ancien post incompréhensible ci dessous, ne pas lire)
 
 
j'ai mis que ce div soit de la classe (disons) mover quand je passe ma souris dessus, et les sous div sont de la classe mout à moins que je passe ma souris dessus...
le problème que je rencontre est que la classe du surdiv "piétine" celle des sous div, car les sous div sont aussi soulignés alors qu'ils ne le devraient pas car leur classe contient text-underline:none;
 
si vous pouviez m'aider, à l'url suivante vous trouverez l'exemple:
 
http://pouet.cocomatic.net/meca/meca_nav.html
 
cliquez deux fois sur test avec urls bidon pour voir apparaitre les div,
merci bcp et silvousplait aidez moi :( paske je perds plein de temps et ne vois pas d'ou ça peut bien venir :/
 
 
edit: la popup qui apparait est une fenetre de debogage indiquant les classes de tous les DIV de la page, la calsse qui m'intéresse en particulier est mout et mover, correspondant à non-souligné et souligné



n°248210
k666
dites non à petitmou
Posté le 19-11-2002 à 10:25:08  profilanswer
 

oui c bien ce qu'il me semblait et c'est très gênant :( je sais pas si je vais m'en sortir :(
ya pas un autre attribut qui ne soit pas text-decoration et qui fasse du soulignage ?????
merci

n°248224
gm_superst​ar
Appelez-moi Super
Posté le 19-11-2002 à 10:49:11  profilanswer
 

MAIS TU PEUX PAS METTRE TON NOEUD ET LE ONMOUSEOVER DANS UN SPAN ?! (3 fois que je demande)


---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
n°248239
k666
dites non à petitmou
Posté le 19-11-2002 à 11:05:24  profilanswer
 

sisisi!!! c ça que je dis, c ske je vais faire!!! je vais faire:
 
<div id="/123456/12345/">
 
  <div id="/123456/12345/titre/">titre du dossier</div>
 
  <div id="/123456/12345/contenu/">
    <div id="/123456/12345/123">contenu 1</div>
    <div id="/123456/12345/124">contenu 2</div>
  </div>
 
</div>
 
 
 
etc!!! mais bon c pas une belle solution, ça complique encore plus mon gros caca :/

n°251288
k666
dites non à petitmou
Posté le 22-11-2002 à 12:00:05  profilanswer
 

bon j'ai finalement fait comme vous m'avez conseillé, mais le code est bcp plus cradeau qu'avant!!! mais ça déchirax!!! :) au cas où si ça intéresse les curieux ! super menu de navigation JS plein de styles chanmax etc!
 
 
http://pouet.cocomatic.net/mecav2/meca_nav.html
 
 
 
commentaires si yen a ? :)

mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [HTML/JS/CSS] problème avec les styles!!

 

Sujets relatifs
[CSS] Validateur down ?[HTML]Comment "lisser" l'affichage d'infos bulles et les arrondir ?
Besoin d'aide pour mon site HTMLDIV/CSS > comment centrer verticalement un div dans un autre div ?
Probleme d'upload interactif ...[CSS] problème de bordure
probléme java , windows XP[HTML] Y'a moyen de transformer un tableau....
[HTML,JS] Afficher l'adresse IP dans une page 
Plus de sujets relatifs à : [HTML/JS/CSS] problème avec les styles!!


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR