Dans un menu, ya des titres ecrits en corps normal, dans la CSS je lui dis a:hover{ font-weight:bold; } le probleme c que la ligne s'élargit et quand ya trop de texte.. ça passe à la ligne... et c'est tres laid !  
 
Quelqu'un aurait une astuce pour eviter ce genre de probleme ?
 
Merci

ajoute un width en ``em``?
white-space:nowrap?

ouai je maitrise pas trop les "em" c'est une taille proportionnelle c ça ? mais ça etre proportionnel à la cellule tu tableau je pense.. que va t il se passer si le texte comporte moins de caracteres ?

1em=la hauteur d une lettre

c est fonction de la taille de la police utilisée

De la doc:
http://www.w3.org/TR/CSS1#length-units

ouai mais là ça va pas aller comme ça... mes cellules ont une taille fixe, et mon texte doit etre en taille 11 (en gardant la charte graphique du client)
simplement le caractere gras est plus large que le caractere normal... donc quand on passe dessus, ça bouge ! et moi j'aimerai que ça ne bouge pas

> mon texte doit etre en taille 11
l internaute peut toujours choisir sa taille de police
 
essaye l exemple que je t ai donné, il fait exactement ce que tu décris. le <table> sert juste dans l exemple pour essayer de forcer le div à être plus petit, mais il se laisse pas faire!

> width:15ex;
indique que le texte fait au plus 15 lettres (une petite marge pour le gras)
 
> height:1.2em;
indique que le texte fait au plus 1,2 lettres de hauteur (une petite marge pour le gras)
 
> white-space:nowrap;
indique que les espaces sont non sécables.

A noter, quand même, que le fait que le survol des liens modifie la mise en page fait partie des "mauvaises pratiques"...

Raisons ?

> A noter, quand même, que le fait que le survol des liens modifie la mise en page fait partie des "mauvaises pratiques"...
 
je pense qu il a voulu dire que c est casse geule
 
> Raisons ?
 
cette thread en est un exemple

http://opquast.org

+1
 
Et en plus c'est très laid.

bah moi j'y peux rien.. c la maquette du client qui est comme ça, sur photoshop forcement ça bouge pas ! lol ! mais des que ça tiens plus sur une ligne... c laid !

Alors freed102, ça te convient comme méthode les ex/em et nowrap?

et bien j'ai pas trop eu le temps de m'y pencher.. j'ai essayé les nowrap.. c pratique..Mais du coup ça me bouffe mon text-indent.. et ça dépasse
 
http://www.freedfromparis.com/temp/OR/_test/test2.htm

rajoute le width et le height...
avec FF, j ai l indentation...

je suis en train d'essayer mais ça fait rien.. je dois mettre quoi pour font-size?

tu laisse font-size à 11pt,
tu ajoute width:30ex;
et height:1.2em
et tu teste, ensuite ajuste le width.

bah je viens de le faire.. mais je vois pas la différence.. je vois pas ce que fait width:30ex... je l'ai peut etre pas mis au bon endroit ?

width:25ex; dans nav_gauche
height:2em dans td
white-space:nowrap;  dans a

du coup le menu garde les même proportions quand l internaute change la taille de la police

ah oui mais ma nav gauche doit absolument faire 130px ! si ça fait 131.. je suis mort ! lol

ha ouais, il te reste à mettre des des px... tu dira à ton client qu il aura déjà un visiteur en moins! (j utilise toujours une taille de fonte perso)

bah je pense que ça va finir par des négociations et des propositions pour éviter ce probleme

bon sinon j'ai remarqué un truc chelou sur mac (encore et toujours !!!) quand je clique sur un lien sur netscape ou camino,  ya tout mon bloc qui se déplace de sa propre taille en hauteur vers le bas! .... j'ai jamais vu ça... c quoi ???

> j'ai jamais vu ça... c quoi ???
une implémentation originale
sérieux, j ai pas mac pour tester, mais ça arrive des trucs du genre avec du css sur d autres navigateurs, il va te falloir de la patience pour trouver le morceau de css qui est responsable...

si quelqu'un peu regarder.. mais je crois qu'en fait c lié au même probleme... quand je clique sur un lien... la colonne s'agrandit avec le texte... quand je clique une deuxieme fois sur le lien... le bloc descend
 
http://www.freedfromparis.com/temp/OR/_test/test4.htm

 
Ben tu expliques au designer que c'est un gros nazze de prévoire une maquette au pixel près pour du web, avec un roll-over en gras. Un graphiste c'est bien placé pour savoir qu'en bold ça va donner plus large à moins d'avoir une police genre courier. Et tu expliques au client qu'il faut faire des concessions en matière de design web. Mais bon, tu devrais savoir géré ça puisque dans ton profil il est noté que tu es webmaster et graphiste ...
 

 
Si tu commençais par la base, à savoir lire un peu de théorie et pratiquer des choses simples tu arrêterais de pondre un mélange de css/tableau douteux, sale, lourd et ça pourrait bien t'éviter des problème foireux. Plus tu fais simple moins tu te prends la tête à chercher des erreurs. D'ailleurs, pas besoin d'aller sur mac, si tu mattes ton exemple sur Firefox pc ou opera, c'est laid et ça ne correspond pas à ce que tu as sur IE. Tu mets toujours la faute sur quelque chose: pas de chance, les css, le mac etc... mais tout vient de ton manque de connaissances de base et donc d'utiliser les bons outils pour résoudre/contourner les éventuels problèmes de compatibilité.
 
Pour finir je trouve que tu as bien de la chance qu'autant de monde se penche encore sur tes problèmes, bien que tu ne mettes jamais un seul merci suite aux réponses que tu ne prends d'ailleurs pas le temps de tester correctement.

 
 
Et bien ! je vois que c ma fête !!!
 
alors on va prendre les choses dans l'ordre....
 

oui je suis graphiste et webmaster... je connais donc les contraintes pour ça il n'y a pas de probleme.... le probleme c'est que le client à livré une maquette photoshop... que je n'ai encore eu aucun contact avec ce client, et qu'avant de lui mettre dans les dents que c'est un gros naze et que ce qu'il a fait c'est un truc de naze... j'ai pour habitude de chercher d'abord si quelqu'un a déja rencontré le probleme et s'il a une solution à me proposer.... c'était le but de ce topic à la base...
 

là on va en revenir toujours aux mêmes choses, je sais tres bien que faire des tables c'est mal, qu'il faut faire un code syntaxiquement et semantiquement correct etc etc... j'en connais les principes, je les approuve...
Simplement à l'usage je me rends compte que c'est toujours bancal, ya toujours un navigateur qui n'interprete pas ça de la même maniere qu'un autre, ya toujours un truc qui va faire que ma page ne ressemblera pas à ce qu'elle devait ressembler au depart... si j'avais plus de temps, j'aurai continué dans cette optique (chose que j'ai commencé à faire au début !)
 
la deuxieme chose à savoir concernant ce site.. c'est qu'il s'agit d'un rebranding d'un site deja existant, la marque change de charte graphique, on reprend les élements existants et on en refait un nouveau site...
le probleme c'est que le site deja existant comporte un code vraiment degueulasse... avec des balises <font> des input sans id, des image sans alt, des  urls mal codées, des <span> imbriqués, des class avec des noms à deux balles, des tableaux à la pelle imbriqués et pas alignés.. bref.. j'en passe ! Tout le contenu du site est dynamique (JSP).. et j'ai pas la main dessus pour l'instant...
Il faut savoir que j'ai 1 mois pour refaire le site entierement, et que ma mission etait de faire un site INDENTIQUE à la maquette (au pixel pres) et le code doit etre valide W3C en html 4.01 transitional... on m'a bien dit "on ne veut pas du XHTML, on ne veut pas un code irreprochable ...mais on veut des pages assez légeres et valides!"
 
donc j'ai deja aisement allegé le code HTML... j'ai préféré faire des <tr> dans les boucles dynamiques plutot qu'inserer un tableau à chaque enregistrement... (comme c t avant), au fur et à mesure je nettoie le code (quand je peux parceque quand tout est dynamique.. t'as pas toujorus la main sur le code).. bref j'essaie de faire au mieux possible pour aller plus vite et satisfaire mon chef de projet !
 
Pour info, ma page est constituée maintenant de 4 tableaux maximum
un tableau pour le squelette du site général, un tableau pour la nav (que je remettrai surement en liste <li> quand j'aurai plus de temps) un tableau pour le contenu (avec des tr pour les boucles dynamiques) et un autre tableau pour le footer...  
vous comprendrez que je ne peux pas faire mieux pour le moment... Sachant que ces 4 parties sont distinctes et découpées en includes (JSP)
 
PS : chez moi sur FF/IE PC ça marche tres bien et sur Safari et IE mac ça marche pas mal non plus ! je sais pas où t'as vu que c t différent ! faut pas trop se fier à la page de test que je vous ai donné.. je l'ai bridée un peu, c t juste pour constater mes problemes concernant la barre de nav.. le reste on s'en fout !
 
 

 
Là je te trouve un peu dur sur cette remarque... je suis vraiment pas quelqu'un d'impoli et je respecte chaque personne sur ce site, si tu regardes mes anciens posts tu pouras remarquer que quand j'ai règlé un probleme je remercie toujours, et si je ne le fais pas, c'est pas part manque de volonté c'est plutot par oubli...  Je respecte chaque personne avec sa façon de faire, je ne cherche qu'à evoluer dans le bon sens, ya certaines choses qui sont pas toujours claires pour moi... c pour ça que je fais appel à vous, les solutions qu'on me propose je les essaie... si ça marche je les garde.. si ça marche pas.. faute de temps.. je change et je vais au plus simple ! Je ne suis pas là pour polluer le site ! loin de là ! Et si j'ai le pouvoir moi aussi d'aider en contrepartie... c'est avec plaisir !

 
Oky, merci d'avoir pris le temps de répondre aussi longuement; ça me réconcilie avec l'image que je m'étais faite de toi
 
Mais si tu consultes tes anciens postes, tu verras que mes propos ne sont pas infondés et il serait appréciable, même si tu n'obtiens pas toujours la solution souhaitée, de remercier les personnes qui prennent le temps de t'aider plutôt que de surenchérir tout le temps avec le problème suivant
 
Effectivement expliqué comme ça, on comprend un peu mieux les contraintes du site en question. Par contre je maintiens qu'il te manque des bases essentielles avant de te lancer dans une construction css. Comme bon exemple, ce poste-ci (dans lequel il n'y aucun merci, d'ailleurs ) où tu te crèes un problème qui n'existerait pas si tu utilisais un montage css approprié (peux-tu m'expliquer l'intérêt du float:left ?).
 
Non, ce n'est pas toujours bancal; avec une certaines rigueur et en connaissant certains principes de base, on arrive tout à fait à monter des sites valides sur tous les navigateurs récents (je ne parle pas de netscape 4.6 ). Maintenant le site en question n'est peut-être pas le bon site pour t'exercer vu les exigeances particulières.
 
Perso je ne suis pas complètement fermée à l'utilisation de tableaux dans certains cas bien précis, la mise en vigueur actuelle des css par les navigateurs rendant encore certaines mise en page fort délicates (particulièrement lorsque tu n'as pas la maîtrise sur le contenu).
 
Pour la différence sur FF que j'ai observée: les barres grises de séparation de ta nav n'ont pas toutes la même longueur (plus courte en bas) et le clic sur les liens ne donnent pas le même rendu (bon j'imagine que vu que tu changeras de page, ça ne portera pas vraiment à conséquence).
 
Voilà, j'espère que tu t'en sortira avec ton site dans les délais; bonne chance, à première vue si le client est inflexible tu risques de galérer...
 

 
Et bien là en l'occurence.. je n'ai pas remercié car pour moi le probleme n'est pas résolu, j'attendais d'autres réponses, et en attendant je suis passé à autrechose pour gagner du temps, mais les messages passent du coup le topic est passé à la trappe ! mais mon intention est bonne.. croyez moi je suis vraiment pas quelqu'un de sauvage et mal élevé bien au contraire... je suis simplement un peu étourdit et maladroit, mais bon ça vous pouvez malheureusement pas vous en rendre compte... vous ne me connaissez que virtuellement !
 

mon float:left devait servir à un moment ou j'avais plusieurs blocs cote à cote (ça date du moment ou j'ai commencé à faire tout le site sur une base XHTML (avec des div etc etc)... quand j'ai vu que j'arrivais pas à mettr trois blocs cote à cote sans problemes de chevauchements ou de marge ou je ne sais quoi.. j'ai préféré revenir aux bon vieux tableaux pour ne pas etre dans les choux... au pire je me dis que ça devrait pas etre tres compliqué à restructurer ma page en div si j'ai du temps.. vu que tout est séparé... chaque chose en son temps !
 

c ce que je disais au debut... j'approuve totalement le fait d'avoir un code propre, clair et semantiquement correcte... si ça ne tenais qu'à moi je l'aurais fait ainsi ! je connais les regles essentielles pour faire une page valide, je connais aussi le sens de chaque balise et j'aimerai les utiliser au bon moment ! Mais je trouve que pour le moment c pas tres maniable.... j'attends le jour ou ce sera vraiment un standard incontournable, stable et maniable, j'ai probablement des lacunes niveau CSS (je l'avoue ya souvent des choses qui m'echappent, ne serait ce que pour la mise en forme de mes liens... quand je vois que quand je mets a.lien1:hover{text-decoration:underline;} et que quand je passe sur mon lien je vois pas de soulignement.. je me dis que j'ai du rater quelquechose !) mais chaque jour en me renseignant et en lisant vos réponses j'avance et j'apprends de nouvelles choses... il faut savoir qu'il y a encore deux ans je savais même pas ce qu'était du XHTML !
 

 
pour le prob de FF j'ai pas remarqué.. je vais regarder de plus pres...
 
Et MERCI beaucoup pour tes encouragements !! lol ! effectivement je vais surement galerer.. surtout quand tu sais que les maquettes ne sont pas encore vraiment validées.. et qu'à tout moment tout peut changer !