Les cadres de ma page se baladent

Bonjour,
J'ai osé copier le code css pour une page trois cadres, que voici,

div#colG {
	float: left;
	width: 130px;
	background: lightblue;
}
div#colD {
	float: right;
	width: 200px;
	background: burlywood;
}
div#colC {
	margin-left: 200px;
	margin-right: 210px;
	background: khaki;
}
Et via un commentaire conditionnel visant Internet Explorer 6 et inférieurs :

div#colG {
	margin-right: 7px;
}
div#colD {
	margin-left: 7px;
}		
div#colC {
	overflow: visible;
	height: 1%;
}

J'essaie de débuter en css, et mon problème, j'ai bien réussi la séparation, sauf que les cadres ne se présentent pas bien, on peut le voir http://creermonsite.free.fr/SpipCadre

Je pense que j'ai loupé quelque chose, puis-je avoir de l'aide?
Merci d'avance.
Modifié par Igor (13 Jul 2007 - 09:09)

Bonjour et bienvenue sur Alsacréations ,

C'est ton code html qui n'est pas bon, il faut placer d'abord les deux div que tu fais flotter (colG et coldD) et ensuite la div div centrale (colC)

De plus, la colonne de droite est en dehors du conteneur qui englobe les deux autres colonnes. C'est voulu?

Bonjour,
Je suis débutant, et beaucoup de choses m'échappent

a écrit :
tu fais flotter (colG et coldD) et ensuite la div div centrale (colC)

Voilà, pour moi ce langage me fais partir dans les nuages je viens de tenter de déplacer le colC mais ça met la pagaille.
Puis-je avoir plus de détail?
Merci pour la rapidité de la réponse

Bonjour,
Pour le cadre en dehors du conteneur, pas du tout, c'est une erreur, je change ça.

mailou a écrit :
Voilà, pour moi ce langage me fais partir dans les nuages

Ben ça correspond à ce qu'il y a dans le tutoriel que tu as repris, qui comporte l'avertissement suivant:

a écrit :
On crée trois blocs qui accueilleront notre contenu :

<div id="colonne1">...</div>
<div id="colonne2">...</div>
<div id="centre">...</div>

Jusque là, ça n'est pas très compliqué.

Attention : les éléments flottants, que l'on placera sur les côtés, devront être placés en premier dans le code HTML.

Bonjour,
OUF!! je crois que j'ai compris pour les emplacements de colonnes, mais alors pourquoi dans la colonne centrale l'article est en bas du cadre?

À cause de ceci (dans habillage.css):

.liste-articles li {
clear:both;
}

Plus de détails dans cet article:
http://www.blog-and-blues.org/articles/Float, _clear_et_contextes_de_formatage

OUF, ça y est, ça semble bien marcher, mais honnêtement, j'ai vraiment nagé dans l'article de référence, même que des fois ça m'a vraiment énervé , et je l'avoue, le hasard m'a bien aidé dans la mesure ou c'est un peu comme ça que j'ai supprimé l'indication.
Merci pour la patience et cette aide, c'est la première fois que je me jette sur le css, la prochaine fois j'irais plus loin, juste une question, pour faire les coins arrondis c'est bien avec du css non?
Merci encore.

mailou a écrit :
juste une question, pour faire les coins arrondis c'est bien avec du css non?

Oui, et à la fois non, c'est compliqué. Ça dépend de ce que tu veux faire exactement.

J'ai vu sur des sites à trois colonnes, des cadres comme les brèves, les commentaires, encadrés avec les coins arrondis, je trouve ça beau. Mais si c'est compliqué..... c'est pas pour moi pour l'instant
Merci

Ce n'est pas si compliqué, surtout quand c'est bien expliqué
Une boite de largeur fixe avec bordures et coins arrondis.

Non, ce qui est compliqué c'est de répondre à la question «pour faire les coins arrondis c'est bien avec du css non?».

La réalisation d'un cadre de largeur fixe via des images de fond et pourvu qu'on ait les éléments HTML qui vont bien comme support, c'est effectivement pas bien compliqué.

Bonsoir,
Il est tard, je mets ça sous le coude, ce sera pour moi une prochaine étape, s'il y a des tutos sur la question je suis preneur
Merci et bon WE à tous.