28173 sujets

CSS et mise en forme, CSS3

Bonjour,

J'avais trouvé sur ce site un petit code sympa, que j'ai adapté pour m'en faire un menu.
Le problème c'est que je n'arrive pas a garder ce menu à sa place sous Mozilla (avec IE, ca marche nickel !)

Je vous montre : (il ne s'agit que d'une maquette, il n'y a rien sur ce site...)
http://etoc.net.free.fr/maquettes/

Sous IE, les liens du menu sont bien en place, mais si l'on passe à Mozilla, plus rien n'est en place...(et si je rajoute un "left:27%" sous mozilla ca marche "à peu près" mais plus sous IE) snif!

Quelqu'un a une astuce ? une idée ?

PS: lien vers le CSS

Merci beaucoup!
Bonne journée,
tom
ok, je vais tester, ca fait tellement longtemps que je cherche la solution!
mais en fait, pour ma part c'est le contraire, sous IE ca marche impec... c'est mozilla qui foue tout en l'air... m'enfin je vais essayer ce "!important".

Merci, et si quelqu'un a d'autres idées...
Bonjour,

bekhan a écrit :
Comme je l'ai dit dans l'autre post, essaye !important.

À vrai dire, je n'imagine pas un seul cas où l'utilisation de !important pour compenser un problème avec un navigateur particulier soit recommandée. Donc je pense que mieux vaut oublier ça.

S'il s'agit d'adresser un correctif à Internet Explorer, il existe un mécanisme appelé les commentaires conditionnels, qui est ce qui se fait de plus fiable. On peut oublier les hacks CSS, qui posent trop de problèmes ou en poseront peut-être à l'avenir. Au sujet de ces deux notions (hacks et commentaires conditionnels), voir la FAQ du forum.

Si le problème se produit avec Firefox, Opera, etc., c'est très probablement un problème dans la conception plutôt qu'un bug (surtout si on constate le même bug avec Firefox et Opera, ou Opera et Safari, on Safari et Firefox, etc.). La démarche «j'applique un correctif à tel navigateur» est alors erronée.

Pour en venir à la page présentée par etoc: désolé, à la fois ce design et l'intégration qui en a été faite sont puissamment casse-gueule.
- design: pas pensé pour l'extensibilité en hauteur (erreur de débutant, sans doute?);
- intégration: abus carabiné du positionnement absolu.

Sur ce dernier point: le positionnement absolu est une méthode de positionnement assez radicale, et mal utilisée (voire, à la base, mal comprise) elle peut poser de nombreux problèmes. En règle générale, si je vois plus d'un bloc de contenu positionné en absolu dans une page, je sais qu'il y a un problème de conception. Ici, on en a 5. Problème.

Bonne continuation (et bon courage). Smiley smile
a écrit :
désolé, à la fois ce design et l'intégration qui en a été faite sont puissamment casse-gueule.
- design: pas pensé pour l'extensibilité en hauteur (erreur de débutant, sans doute?);
- intégration: abus carabiné du positionnement absolu.


En fait il ne s'agit pas d'un design de site, mais de travaux, de tests, d'essais, donc concretement je n'ai pas pensé l'intégrer dans quoi que ce soit Smiley smile (pas forcément débutant, mais amateur qui cherche à s'améliorer Smiley cligne )

Pour le positionnement absolu, effectivement, je vais essayer de changer ma façon de faire, parce qu'en fait, c'est ca qui me bloque arrivé ici...

merci en tout cas, maintenant je sais ce qu'il faut que je change!
etoc a écrit :
merci en tout cas, maintenant je sais ce qu'il faut que je change!

À vrai dire, la première chose à changer c'est le code HTML, qui n'est pas du tout valide. Tu n'as par exemple pas de Doctype, et donc ta page sera interprétée par les navigateurs en mode Quirks (c'est à dire: chacun à sa sauce perso...).

Voir ici:
http://css.alsacreations.com/Bases-et-indispensables/DTD-comment-choisir

Je te conseille également d'utiliser la syntaxe XHTML. Concrètement, ça ne change pas grand chose, mais c'est très utile pour apprendre à être rigoureux avec le code qu'on produit... et comme c'est une syntaxe plus stricte, c'est finalement plus facile (plus besoin de choisir entre les trois ou quatre manières possibles d'écrire la même chose...).

Enfin, ne pas hésiter à lire (et si besoin relire) les tutoriels de base sur Alsacréations, ainsi que ceux sur Openweb (notamment ceux qui concernent le positionnement CSS).

Encore une fois, bonne suite à toi. Smiley smile