Discussion :

[maysa]

Bonjour,

Je souhaiterai insérer une image à gauche puis à coté le titre et sous le titre, le prix...

seulement je n'arrive pas à mettre le prix, le titre à droite de la grande image tout se met en dessous.
voici mon code :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
<div class="contenuBlocGrandeJacquette">
					<img src="../images/img_accueilGrande.jpg" class="JacquetteGrandContenu"/>
					<span class="titreLivreGrandeMaquette">Le titre </span><br />
					<span class="titreLivreGrandeMaquette">Le prix</span>
 
					</div>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
.contenuBlocGrandeJacquette{
 
	padding-bottom:5px;
 
}
img.JacquetteGrandContenu{
 
  	margin-top : 5px;
   margin-left : 5px;
	border:#333333 1px solid;
	width:50px;
}
.titreLivreGrandeMaquette {
	margin-top : 5px;
	padding-right:5px;
	position: relative;
	vertical-align:top;
}

J'ai bien pensé à mettre à float left à mon image mais ça dépasse de mon bloc central...

Comment faire ?
Merci d'avance

[Bisûnûrs]

Qu'est-ce qui dépasse de ton bloc central lorsque tu mets le float:left ?

[maysa]

c'est l'image qui dépasse du bloc central...

[maysa]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 <div class="AccueilContaintDroite">
			<div class="titreBloc">Ici le titre</div>
			<div class="contenuBloc">
				<div class="contenuBlocGrandeJacquette">
					<img src="" class="contenuBlocGrandeJacquette"/>
					<div class="contenuPrixLivre">
						<span class="titreLivreGrandeMaquette">Le titre</span>
						<span class="prixLivreGrandeMaquette">Le prix</span>	
					</div>	
				</div>
				<p class="lienRubrique">Ici mettre le lien</p>
			</div>
	</div>

il dépasse du div "AccueilContaintDroite"

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
.AccueilContaintDroite{
 
		width:					177px;
		margin-left:			7px;
		margin-right:			7px;
		text-align:				center;
		border:					1px solid #666666;
		margin-top:				5px;
		margin-bottom:			10px;
}

[Bisûnûrs]

En hauteur ? En largeur ?

Merci d'être plus précis.

Même si je suppose que c'est en hauteur ... Donc rajoute overflow:hidden sur ton conteneur.
Pourquoi ? Une simple recherche sur le forum, voire lecture des sujets ouverts sur cette première page te donnera la réponse étant donné qu'elle est traitée deux fois par jour.

[maysa]

l'image dépasse de mon bloc en hauteur, elle se trouve en bas. mais le problème ne vient pas de là ce que j'essaye de faire c'est de mettre le prix et le titre à coté.
J'ai regardé les autres recherches et n'ai rien trouvé.
Désolée.

[maysa]

Merci ça marche overflow hidden...