28173 sujets

CSS et mise en forme, CSS3

Bonjour,
Bon le titre j'ai eu du mal à le trouvé :S

Alors voila mon souci, je veut faire un site avec deux colonnes de chaque cotés et un centre. Jusque la pas de probleme me direz vous.
Mais que quand les colonnes poussent mon pied de page, elle allongent également le centre...
Voici mon début de site:
http://benjy51.free.fr/test/

Pour le moment on voit que les colonnes poussent bien le pied de page ou que même le centre pousse bien le pied.
Mais comment faire pour que quand les colonnes s'allongent, elles entrainent également le centre?
Merci Smiley lol
Modifié par cerede2000 (05 May 2007 - 16:28)
Hum ouai mais bon je voudrai pas faire une image surtout pour les couleurs utilisées :S Il n'y a pas une autre solution?
Surtout que c'est une mise en forme à 3 colonnes Smiley sweatdrop
Modifié par cerede2000 (05 May 2007 - 00:29)
bonjour,

J'ai peut etre une solution mais elle n'est pas en CSS elle est en Html :
creer un tableau avec des "td" et des "th" (les td en blanc et les th en noir)
ex :
CSS
td {
	background-color: #FFFFFF;
}
th {
	background-color: #2E2E2E;
}
body {
	background-color: #2E2E2E;
}

html
<table width="780" border="0" cellspacing="0" cellpadding="2">
  <tr>
    <th> </th>
    <td> </td>
    <th> </th>
  </tr>
</table>
Pourtant ce sont les 2 meilleures solutions. Soit une image de 900px de large dans la div#conteneur (ou une div qui inclut seulement #gauche, #centre et #droite), soit un tableau à 3 colonnes (le reste de la mise en page restant construit en div).
Pour ma part, je vais tout à fait dans le même sens que Florent. Qu'est-ce qui te dérange ou te pose problème dans cette solution cerede? C'est pourtant léger, très facile à mettre en place et propret, non?
cerede2000 a écrit :

Mais que quand les colonnes poussent mon pied de page, elle allongent également le centre...


Ce n'est pas possible.

C'est une limitation des css.

Ce qu'évoque Florent est très bien car c'est une petite jonglerie qui contourne parfaitement cette limitation.

Ce que propose stuka57 est très bien aussi car ça évite, à très peu de frais, de subir cette limitation.

A toi de choisir donc Smiley cligne
cerede2000 a écrit :
Par contre ce que propose stuka57, il met un th en bas ce n'est pas normalisé ca! Ca devrait etre un tf non?

Un tf, c'est nouveau ? Smiley langue

Les éléments th peuvent être placé aux mêmes endroits que les éléments td (c'est-à-dire dans les éléments tr), à condition bien sûr que cela ait un sens.
stuka57 a écrit :
creer un tableau avec des "td" et des "th" (les td en blanc et les th en noir)

Là, c'est une bêtise. Pas l'utilisation du tableau, tout à fait appropriée (et non, les tableaux ne sont pas à proscrire), mais l'utilisation abusive de l'élément th pour ce qui n'est absolument pas un en-tête de ligne ou de colonne.

Je me permets de corriger ton exemple :
[b]CSS :[/b]
td {
	background-color: #FFFFFF;
}
td.lateral {
	background-color: #2E2E2E;
}

[b]HTML :[/b]
<table summary="">
  <tr>
    <td class="lateral"> colonne de gauche </td>
    <td> colonne centrale </td>
    <td class="lateral"> colonne de droite </td>
  </tr>
</table>

J'ai supprimé les attributs HTML de mise en forme du tableau. On le fera en CSS (je ne détaille pas, voir une documentation quelconque sur la mise en forme des tableaux en CSS, par exemple sur Openweb : http://openweb.eu.org/articles/tableaux_css/ ).
Modifié par Florent V. (05 May 2007 - 15:02)
Bonjour.

Pour avoir plus de possibilité il faudrait que l'on puisse faire référence dans les CSS au style réel ( ce qui serait comparable à un getComputedStyle() Javascript ). Dans ce cas précis on pourrait alors jouer sur des pourcentages en mettant les trois colonnes dans un div conteneur.
Modifié par CNeo (05 May 2007 - 16:37)