28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

après avoir été le roi des <table> il y a quelque temps (bouhhhh Smiley smile ), je me suis donc mis aux css avec grand plaisir grace à tous les tutoriaux présents sur ce magnifique et très utile site ! Depuis, aucun problème avec des sites contenant une mise en page assez simple. Mais là, je suis sur une mise en page un peu plus complexe avec pas mal d'élements imbriqués et je sèche ...

Le site à une largeur fixe de 815px et le but est que le site prenne, minimum 100% de la hauteur pour les résolutions 1024*768 et supérieures (donc ici concernant la hauteur >=768). J'aui réussi à faire une mis en page ok pour du 1280.

le but étant pour l'instant que la mise en page soit ok pour ie7, le problème avec ie6 viendra plus tard ...

d'après mes différents tests, pour que ce soit ok il faudrait que mon bloc "centre" est une taille de 100%-169px (16+118+30+5) or je n'ai pas trouvé d'info dessus donc j'imagine que c'est impossible. J'en conclus donc que c'est la logique de tout le positionnement qui doit être à revoir mais la je vois pas ...

Aussi, si un oeil d'expert passe par la, tout conseil et aide seraient les bienvenus Smiley smile

merci d'avance pour vos commentaires

cordialement

Vincent
Modifié par vincent-angel (08 Oct 2009 - 21:04)
sniff 100 visiteurs mais pas une réponse Smiley decu
j'imagine que soit c'est impossible ou très complexe soit je me suis vraiment mal exprimé ...

je me suis donc de nouveau mis à la recherche et essai de nouvelles solutions ... j'ai donc réussi à peu près à faire ce que je voulais en utilisant du javascript. Je récupère les hauteurs d'éléments (fenêtre et 2, 3 div) et je modifie les hauteurs en dynamique ...
Ca ne me plait pas mais bon depuis le temps que je patauge, j'ai au moins pu avancer un peu.

Il ne me reste que 2 soucis mineurs alors, si vous avez quelques idées ou solutions, merci d'avance :

sous ie6 :
- decalage vertical : decalage entre le premier bloc et le 2e. J'ai donc cherché le bug des 3 pixel (j'en ai déjà corrigé un plus bas ...) mais sans succès ...

http://img148.imageshack.us/img148/9326/decalageie6coupe.png
avec le fond rouge, on voit bien qu'il y a un petit espace entre les 2 blocs ...

site test simplifié pour bug :

site test


site complet :

site test css normal css ie6 javascript

merci d'avance pour vos visites et commentaires !

Cordialement

Vincent
Modifié par vincent-angel (22 Mar 2009 - 14:46)