28173 sujets

CSS et mise en forme, CSS3

bonjour,

j'ai un div conteneur qui contient une image.
à droite de cette image j'ai 3 lignes de :
- titre
- prix
- et un bouton (img)

ces 3 éléments sont dans un div mais j'aimerais que tous ces textes soient à x pixel du div conteneur et non du texte précédent .
(je veux aligner ces 3 lignes à mon image et mettre aligné au bas de l'image mais si le titre se met sur 2 lignes tout ce décale !

<div class="contenuBlocGrandeJacquette">
		<div class="GrandeJacquette">//ici mon image//</div>
		<div class="contenuPrixTitreGrandeJacquette">
		<h1 class="titreLivreGrandeMaquette"><a href="lien.php">mon titre</a></h1>
		<h2 class="prixLivreGrandeMaquette"> 5 €</h2>	
	span class="btnAjouter"><a href='lien.php'>
<img src='images/acheter_blanc.gif' border='0' alt=""></a></span>
	</div><!-- fin div contenuPrixTitre -->
</div> <!-- fin div contenuBlocGrandeJacquette -->


css :

.contenuBlocGrandeJacquette{

		overflow:				hidden; 
		padding-bottom:      5px;
		width:					auto;
}

.contenuBlocGrandeJacquetteBas{
		float:					left;
		width:					50%;
		overflow:				hidden;
}

.GrandeJacquette{
	
		float : 					left;
		margin-top : 			5px;
		margin-left : 			5px;
		border:					#333333 1px solid;
		width:					50px;

}
.contenuPrixTitreGrandeJacquette {
		float:					left;
		margin-right:			3px;
		width:					110px;
		height:					90px;
		overflow:				hidden;
}
.contenuPrixTitreGrandeJacquette img{
		float:					left;
		width:					auto;
		padding-top:	      2px;
		padding-left:			2px;
		vertical-align:		top;
		
}
.btnAjouter img{
position:relative;
vertical-align:text-bottom;

}

h1.titreLivreGrandeMaquette  {
		width:					100%;
		color:					black;
		font-weight:			bold;
		font-size:				12px;
		text-align:				left;
	
}

h2.prixLivreGrandeMaquette {
		color:					red;
		font-size:				12px;
		margin-top:				-10px;
	 	text-align:				left;

}


voici mon code... Smiley rolleyes comment faire pour aligner a partir du div ?
merci Smiley biggrin
Modifié par maysa (30 Nov 2007 - 14:10)