3 div en largeur dont 1 avec une taille fixe ? [Résolu]

Bonjour,

Alors voila je vais essayé d'etre le plus clair possible.

Pour commencer je sais pas si c'est possible ou pas

avant tout j'ai fais un dessin pour illustrer mes propos :



alors voila :

Pour moi le DIV2 : c'est un div de 1000px de larg, avec une image en background.

DIV1 & DIV3 :

J'aimerai savoir l'ensemble div1+div2+div3 fasse 100% de la largeur de la page.
je sais pas si c'est tres clair, mais en gros pour un écran de 1280 de larg.

j'aimerai que le div1 et le div3 s'agrandissent pour combler les 280 pixels qu'il manque au div2 pour la largeur de la page.

je réponderai aux questions que vous allez me poser car j'ai du mal a exprimer totalement la chose, mais j'espere avoir des réponses.

Merci d'avance
Modifié par muby (06 Mar 2008 - 23:26)

Bonjour,

Et il doit y avoir un contenu dans les DIV 1 et 3?
(Et, dans le cas où aucun contenu n'est prévu pour ces blocs, pourquoi existent-ils donc? )

Ah oui désolé j'ai oublié de préciser que les div1 et 3 ont aussi un background. qui permet en faite d'avoir un div tout du long.

le div1 a le background positionné en right
le div3 a le background positionné en left.

Pas de réponse, parceque c'est pas clair ou parceque c'est pas possible ?

Merci d'avance

muby a écrit :
Ah oui désolé j'ai oublié de préciser que les div1 et 3 ont aussi un background.

Ce qui veut dire qu'ils ont et un contenu et un background, ou juste un background et pas de contenu?

En général, quand quelqu'un demande à faire une mise en page avec trois colonnes dont une colonne centrale fixe et centrée et deux colonnes latérales qui s'adaptent, eh bien c'est que la personne en question a imaginé une mauvaise solution d'intégration (les trois colonnes) alors que quelque chose de plus simple -- et de plus réalisable -- était sans doute possible.

D'où la question suivante: on peut voir à quoi c'est censé ressembler au final? (Pas le schéma avec les colonnes, car cette histoire de colonnes est peut-être comme je le disais une mauvaise solution d'intégration, mais le rendu graphique souhaité.) Ça sera plus simple.

Ok je prépare une démo qui sera je l'espere plus parlante .

voila j'ai fais une démo avec une re-explication au cas ou

http://muby.societeg.com/Help/

Merci d'avance.
Modifié par muby (06 Mar 2008 - 21:15)

Bonjour,

La démo est exactement la même chose que ce que tu demandes dans ton premier message. Ce que je demandais, c'est si cette configuration est un choix d'intégration que tu as fait (c'est à dire que tu as un design et que tu t'es dit: il faudrait que ça marche comme ça). Et si c'est le cas, quel est le design que tu as analysé ainsi?

Les quatre ou cinq dernières fois que des personnes sont arrivées sur le forum avec ce type de demande (trois colonnes, colonne centrale en largeur fixe et centrée horizontalement, et colonnes latérales qui s'adaptent automatiquement), ils cherchaient en fait à intégrer une maquette avec un seul bloc de contenu (le bloc en largeur fixe) et des éléments de décoration (images de fond) autour. Ce qui ne s'intègre pas avec trois colonnes comme tu les décris.

Je réitère donc ma question: quel est le design à intégrer?

Alors voila le design est tel que cette image. Je sais que certains diront que c'est pas forcément jolie, mais c'est telle qu'il doit être (cahier des charge oblige), et donc voila je sais pas si Florent tu peux me conseiller autre chose pour réaliser ma demande.

http://muby.societeg.com/Help/Site.jpg

Merci d'avance

Et voilà. Je disais «les quatre ou cinq dernières fois» dans mon message précédent; je pourrai maintenant dire «les cinq ou six dernières fois».

Je ne vois nulle part dans ce design un jeu de trois colonnes de contenu. Par contre, je vois une bannière prenant toute la largeur de la fenêtre, qui a une couleur de fond unie (bleu ciel) et une image de fond centrée d'environs 1500px de large. Mais de colonnes, point.

En termes d'intégration, on pourra adopter plusieurs solutions pour ce bandeau bleu ciel:
- avoir une image de fond de 2000+ pixels sur body, en background-position: center 50px; par exemple, et placer dessus la partie centrale (un div#header à l'intérieur d'un conteneur centré de 1024px de large par exemple);
- avoir un bloc d'en-tête comme enfant de body, laisser ce bloc prendre toute la largeur de son parent, et lui donner l'image de fond de 2000+ pixels;
- etc.

Pour résumer en code, on ne fait pas:

<div id="extensible-gauche"></div>
<div id="fixe-centre">
	Bla bla ici tout le contenu.
</div>
<div id="extensible-droite"></div>

mais on fait plutôt:

<div id="conteneur-largeur-max">
	<div id="contenu-largeur-fixe">
		Bla bla ici tout le contenu.
	</div>
</div>

Ce qui peut donner:

<body>
	<div id="global">
		<div id="menu">...</div>
		<div id="header">...</div>
		<div id="content">...</div>
	</div><!-- #global -->
</body>

Ensuite, il s'agit juste de jouer sur les images de fond.

On peut aussi envisager de positionner en absolu et en width: 100% un élément qui passera derrière div#global, et qui servira à dessiner (avec une image de fond) le bandeau bleu ciel.
Modifié par Florent V. (06 Mar 2008 - 22:42)

Voila exactement ce que j'attendais comme réponse, je te remercie du fond du coeur Mr Florent V !

I can say : YOUR A BIG BOSS

Encore merci bcp

ps1 : JH'apprécie trop ce forum car les réponses y sont tjrs constructives et vraiment une mine d'information géniale!!!!!!!!!!!!!!!!!!

ps2: ca pourrait etre sympa de gérer des [Résolu] sur le forum car quand on cherche c'est plus sympa d'aller voir un post en sachant qu'on trouvera la réponse a la question du titre:)
Modifié par muby (06 Mar 2008 - 23:27)

muby a écrit :
ps2: ca pourrait etre sympa de gérer des [Résolu] sur le forum car quand on cherche c'est plus sympa d'aller voir un post en sachant qu'on trouvera la réponse a la question du titre:)

Heu... ben je te retourne la remarque: tu peux éditer ton premier message dans ce sujet pour marquer [Résolu] dans le titre. Il n'y a pas de mécanisme automatisé pour ce genre de marquage.

Pour information, c'est la règle 5 du forum.

Oui moi je le fais en général, mais ce n'est pas le cas de tout le monde

Bonjour, j'ai également le même problème que dans ce post et il est impossible pour moi de gérer la chose comme le donne la solution proposé, tout simplement parce que mes background de mes cotés gauche et droit sont différents.

Je me demande vraiment si c'est possible de gérer ce type de problème ?

Bonjour,

Merci d'exposer ce problème spécifique dans un sujet dédié.
On pourra à la rigueur faire un lien vers ce sujet-ci pour l'indiquer comme référence.

PS: s'il y a des contraintes liées au design, il faudra montrer le design en question pour obtenir des conseils un peu concrets.