Css 3 colonnes

Bonjour,

J'ai un peu de mal avec la mise en place en css et div d'un contenu en 3 colonnes.

Je souhaiterais que ma colonne du milieu soit d'une largeur fixe de 960px et que mes colonnes de droite et de gauche aient une largeur de 100% de façon à se qu'elles se redimensionnent automatiquement quelque soit la résolution de l'écran (sauf ma colonne du centre).

Est-ce faisable ?

Salut,

Oui, c'est tout à fait faisable.
Peut être qu'un petit tour sur les gabarits Alsacréations te donnerait déja des éléments de réponse.

Edit : Avec le lien c'est mieux
http://www.alsacreations.com/static/gabarits/liste.html
Modifié par Mikachu (01 Feb 2010 - 17:31)

Je m'y suis déjà rendu mais je n'ai pas réussis à mettre ma colonne du centre en fixe et mes colonnes de gauche et droite à 100%

Salut,

J'ai un petit doute, du coup je voudrais te poser une question. Que sont censées contenir les deux colonnes latérales ? Des éléments de décoration ou du contenu ?

Ca sera deux éléments de décoration (un background en repeat y)

bonjour,

je n'ai pas de réponse mais j'ai exactement le même problème

Salut,

D'accord, je m'en doutais. J'ai bien fait de poser la question?

Donc la seule chose dont vous avez vraiment besoin, c'est d'une seule colonne, soit un div, que vous allez formater à la largeur que vous souhaitez, dans laquelle vous formaterez ensuite votre contenu.
Si vous créez deux div supplémentaires sur chacun des côté, vous alourdissez le code html à des seules fins de présentation, ce qui va à l'encontre des standards pronant la séparation du fond et de la forme.

La solution est finalement simple, de disposer donc votre div centrée avec des marges automatiques. Ensuite, vous n'aurez plus qu'à créer une seule et unique image, qui sera disposée en background sur le body. Cette image comportera la totalité des décorations latérales, et la partie centrale qui correspondra à la largeur du contenu sera laissée vide (ou non selon le design). Libre à vous ensuite selon le design, de répéter cette image ou non en axe Y.

Voilà, tout simplement la solution.
Modifié par Mikachu (01 Feb 2010 - 20:05)

J'y avais un petit peu pensé mais je croyais faire du bricolage lol.

Merci en tous cas !

Bonjour,

Si tu considère le sujet comme étant [résolu], merci de l'indiquer dans le titre de celui-ci.

ps. pour Mikachu : et de quatre

Bonjour,

Je comprends parfaitement que créer des div supplémentaires pour des backgrounds c'est un peu superficiels. Mais est-ce mieux qu'une image aux dimensions de la page ajoutant une dizaine voir une centaine de Ko en plus au chargement ?

Je me permet de poser la question puisque je suis souvent confronté à ce genre de problème notamment pour créer des coins arrondis (border-radius n'étant pas reconnu par IE).
Modifié par Majimerse (02 Feb 2010 - 09:13)

En fait tout dépends de l'image. Une image avec un dégradé de 4000px de large sur 10px de haut (ou même 100) au format gif, ne pèsera pas grand chose. SI l'image est une photo, certes elle pèsera plus lourd, mais c'est rarement le cas.

L'avantage de cette "technique" c'est que le code reste simple.