Div qui n'est pas à 100% de la fenêtre....

Salut à tous et bon week-end !!

Bon voilà j'ai un soucis de div et de css...
En fait je pense que je n'ai jamais réellement résolu ce problème de css...
Bref voilà ma page ici
Ensuite mon problème c'est que quand on réduit la fenetre du navigateur le div qui contient le tout n'est plus à 100% du coup c'est pas beau et le menu de droite dépasse...
Ce qu'il faudrait c'est que ma div ".global_content" qui contient l'image background descende également hors ce n'est pas le cas alors si quelqu'un peut m'aider à résoudre cette histoire que je n'ai jamais réussi a réellement résoudre je l'en remercie d'avance !

PS: auparavant je feintais toujours en faisant par exemple un min-height avec une certaine taille en pixel....
Bref du bidouillage pas très beau quoi....
Modifié par Potchy (14 Apr 2007 - 11:58)

Bonjour,

.global {
	width: 1010px;
}
.global_content
	width:1010px;
}
.content {
	width: 990px;
}

Si tu figes la largeur de tes blocs (par ailleurs à une taille excessive... pour que ça passe en 1024x768, mieux vaut utiliser une largeur de 980px, grand maximum 990px), il n'est pas étonnant que tes blocs ne prennent pas toute la largeur si la fenêtre est plus grande, et qu'ils ne se réduisent pas si la fenêtre est moins large.

Alsacréations a un tutoriel donnant quelques pistes pour la réalisation d'un design fluide qui s'adapte à toutes les résolutions. Je te laisse parcourir cet article.

Vi mais mon soucis ne viens pas de la largeur mais de la hauteur :o
Sinon bah je suis bien obligé de faire une largeur de plus de 980px à cause du design que l'on m'a fournis :'( sinon effectivement j'aurais fait moins mais le contenu du site m'en empêche....

Salut,

Je pense qu'il serait alors plus sage d'adapter le design pour qu'il soit au moins entier dans un écran en résolution 1024x768. Le site ne perdrait pas en ergonomie et navigation pour au moins 83% des internautes (les 17% restant sont ceux en 800x600, qui eux ne peuvent quasiment pas surfer sur le site à une telle résolution ou alors doivent user du défilement horizontal, très pénible à manipuler.

L'idéal est même que le site soit fluide comme le suggérait Florent mais il n'est pas évident d'adapter tous les designs en fluide sans compromis.
Modifié par Mikachu (14 Apr 2007 - 15:17)

Potchy a écrit :
Sinon bah je suis bien obligé de faire une largeur de plus de 980px à cause du design que l'on m'a fournis

Le Web c'est pour les stagiaires.

a écrit :
Si comme moi vous pensez que votre métier ne se résume pas au simple alignement de balises HTML, dites-le haut et fort. Dites-le et agissez en conséquence. Votre client vous demande quelque chose d'idiot ? Dites-le lui, simplement.

Merci pour tte vos réponse bien que cela ne réponde pas à ma question ^^
P-e que je me suis mal exprimé ^^
Bref vous vous êtes tous focalisé sur le design trop large du site ce qui est entièrement vrai ^^
Mais si on outre passe ce design extra large comment pourrais-je régler mon soucis de hauteur svp ????

PS: j'vais modifié ma page pour quel soit moins large du coup comme ça on parlera d'autre chose
Sinon si sa aurait été mon design le site serait vraiment moins large ^^
Je fais souvent des design de site pour une petite résolution

Potchy a écrit :
P-e que je me suis mal exprimé ^^

Oui, je crois que c'est le cas. Au passage, « peut-être » s'écrit aussi bien en toutes lettres, et tu augmentes les chances d'être compris (certains ne saisiront pas telle ou telle abréviation, d'autres utilisent des synthèses vocales qui ont bien entendu plus de mal à lire des abréviations étranges plutôt que des mots correctement orthographiés, etc.). Merci d'y penser.

Quel est le problème exactement ? Le fait que div.menu_right dépasse du conteneur global dans le cas où celui-ci est plus court que le menu ?

En tout cas, c'est un comportement parfaitement normal, vu que tu as utilisé le positionnement absolu pour le bloc du menu. Si tu veux que le bloc du menu vienne agrandir son bloc parent, il ne doit pas être positionné en absolu.

C'est un peu le bazar tout de même cette page. Déjà, ça serait pas mal d'utiliser des identifiants plutôt que des classes pour identifier les éléments uniques de la page, en particulier les principaux conteneurs. <div id="global"> pour le conteneur global, plutôt que <div class="global">.

Ensuite, je me demande un peu pourquoi autant d'éléments sont positionnés en absolu. Le positionnement absolu, c'est vraiment casse-gueule. À n'utiliser que dans un cas où l'on sait très exactement quelles seront les conséquences. Là, il y a un léger abus de positionnement absolu, tout de même. À vue de nez, il devrait être possible de se passer totalement du positionnement absolu pour réaliser cette mise en page.

Ceci dit, ça n'est pas évident. Le problème, c'est que la page que tu présentes n'a pas le moindre contenu. Impossible de savoir avec certitude si une zone est censée accueillir du contenu ou rester vide (blanc typographique).
Il est généralement déconseillé de travailler une maquette HTML/CSS sans le moindre contenu. Si besoin, on utilisera du faux-texte (lorem ipsum dolor sit amet, bla bla...).



----

Suite du hors sujet :

Pour reprendre la citation de Benjamin (« Votre client vous demande quelque chose d'idiot ? Dites-le lui, simplement. »), pour ma part je procèderais ainsi : contacter le graphiste, demander si possibilité d'adapter le design sur une base 980-990px de large. Techniquement, l'adaptation peut être faite par l'intégrateur, si le design n'est pas horiblement complexe à retoucher.
Le cas échéant, confirmer avec chef de projet/client.