28173 sujets

CSS et mise en forme, CSS3

Salut,



Comme dit dans le titres, et oui, la énième personne avec des problèmes de mise en page avec ses DIV selon l’explorateur.

Mon problème :

Site en html & CSS sur 2 colonnes centrées (menu à gauche, corps à droite)

Lorsque j’ouvre la page avec IE, tout est nickel et sous Firefox c’est le foin, mais je sais d’où viens le problème.

Sous IE, mes DIV trop courtes en hauteur à cause du texte, mais la DIV « s’étire » en hauteur pour faire apparaître tout le contenu comme si j’avais mis un tableau <TABLE>… et du coup mes deux colonnes s’allongent de la même longueur.

Sous Firefox, coup classique pour mon « débutantisme » (tout le monde comprend J ) en CSS le contenu sort de la DIV trop courte, du coup c’est la foire à mon c*l comme disait mon sergent jadis et SURTOUT, ma colonne corps de descend pas jusqu’en bas comme elle devrait.

Je sais qu’en travaillant les DIV en hauteur et les MARGIN et PADDING je pourrai y arrivé, mais ce que je me demande, c’est si il y a un moyen que sous Firefox mes DIV se comportent comme sous IE ( euh, IE6 d’ailleurs pour info) et un tableau classique, à savoir qu’elles s’allongent ?


J’ai parcouru les tutos sans, apparemment, trouver mon bonheur, mais étant « joueur », si j’ai loupé l’info dans un tuto donnez moi juste le lien de celui-ci, c’est en lisant et cherchant tout seul que l'on avance !!!


@+


NurboLibra

EDIT: J'ai pas mis de code volontairement, ne voulant pas la réponse direct en code, je vous donne l'adresse de la page en question:
http://www.subaudio.org/diy2.html
Ma page sommaire est nickel sur les deux explorateur, mais dans la colonne CORPS j'ai pas grand chose en contenu donc pas ça allait.
http://www.subaudio.org/sommaire.html
Modifié par NurboLibra (28 Jan 2008 - 15:13)
Salut,

avant toute chose , il penser a valider ton code pour au mois etre sur que le souci de compatiblité ne vient pas de ce coté ci..
ensuite en parcourant ton CSS: tu fixe des hauteur a des div qui sont cencé etre exentisbles Smiley biggol et donc la c'est "normal" que ca plante. le mieux c'est d'utiliser des
min-height
pour des hauteur minimales
Ok, merci pour la validation, j'avais pas mis le bon DOCTYPE Smiley langue !!!

Je sais pour l'elasticité des DIV, j'avais essayer comme ça pour voir ce que ça donnait avec la taille de défini, pour tester j'avais commencer par IE6 qui "agrandissait" les DIV et je m'étais dit: " Cool ça marche !! " je lance Firefox, et paf, tout le contenu en dehors des DIV.

Pour une fois que c'est Firefox qui fou la zone....

Je vais voir avec le min-height mais je sais pas ce que ca va donné avec des DIV avec beaucoup de contenu...

On verra, et je cherche toujours...


@+


NurboLibra
Bon, ça s'est fini en modifiant la hauteur des DIV en les laissant fixe, car pour le min-height c'était bancal entre le corps et le menu pour IE6 alors que pour Firefox ça passait.

Mais si quelqu'un à une astuce pour crée une "élasticité" des DIV je suis prenneur. (mais j'ai cru comprendre que c'était pas possible ?)



NurboLibra