28173 sujets

CSS et mise en forme, CSS3

[Résolu]Problème flotant,une classe qui en contient 2 autres.

Bonjour à tous,

Je fais ma présentation rapidement dans ce poste,j 'apprend depuis lundi le php/mysql/css, et je me heurte à un problème de débutant.

J'ai 4 classes "importantes" dans mon code :
conteneur: similaire à body pas indispensable.
contenu : elle délimite un cadre centré sur la page
colgauche : une colonne contenu dans "contenu" situé sur la gauche.
coldroite : la même chose mais sur la droite.

Mon problème est de réussir à bien placer les 2 colonnes.

Je vais essayer d'être le plus explicite possible.

Tout d'abord le code de la page :


<body> 
    <div class="conteneur"> 
    	<div class="contenu">
    		<div class="colgauche">
    		<?php
    			include('menu.htm');
    		?>
    		</div>
    		<!-- Fin Menu du site -->
         
         	 <!-- Contenu -->
    		<div class="coldroite">
    		<?php
  	   		//un include qui va bien
 		?>
    		</div>
    		<!-- Fin Contenu -->
    		
     	</div>
     </div> 
     </body>


Maintenant mon CSS: 
body
{
	font: 0.8em "Trebuchet MS", helvetica, sans-serif ;
	background: #a4deff;
        margin: 10px 0 ;
	padding: 0 ;
	text-align: center ;
}

.conteneur
{
        border: 2px solid #1c9bb4 ;
	background: #fff;
        width: 770px ;
	margin: 0 auto ;
	text-align: left ;
}

.contenu
{
	padding: 0 30px 0 30px ;
	text-align:center;
}


.colgauche
{	
	//float:left;
	width: 100px;	
}

.coldroite
{	
	width:400px;
	//float:right;
}


Si je laisse comme cela (sans préciser les flottants) j'ai ceci :
http://img134.imageshack.us/img134/8256/prob2py1.th.jpg
en décommentant j'ai :
http://img133.imageshack.us/img133/6476/prob1pk6.th.jpg

Ce que je cherche à avoir serait un mixte des 2. La même présentation que dans l'exemple 1 mais la colgauche à gauche et la coldroite à droite.

Si vous avez des idées merci de m'éclairer.
Modifié par Doragorn (29 Jun 2007 - 16:08)
Quelle rapidité. Les 2 solutions fonctionnent, l'une en rajoutant une classe spacer avec clear:both et celle de ne faire flotter que la colgauche. Merci c'est super, je vais enfin pouvoir m'attarder à quelque chose de plus sympathique.

Je modifie le titre en [Résolu] mais s'il y a d'autre technique n'hésitez pas.
Sujet clos
Aller à