Aller au menu - Aller au contenu

Centrer texte en face image CSS

Pour accéder à cette section
Connectez-vous !
connexion_rpx
Page 1 
Auteur Message
1 visiteur sur ce sujet (1 Anonyme)
Page 1 
Hors ligne gloops # Posté le 22/02/2012 à 14:01:06

Bonjour à tous ! :)

J'ai un problème, je n'arrive pas à centrer du texte en face de mes images...

Voici mon explication en images :

ce que j'ai actuellement :

Image utilisateur


ce que je souhaite :

Image utilisateur

Je verrai après pour la police, la taille,... ^^

Mon code :

Code : PHP
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
if ($customer1 !== $customer2)	
	{
		
$customer1 = (eregi_replace(" ", "", $customer1));		// permet de remplacer l'espace après le nom du customer par rien.  " " ---> ""

$customer1 = strtolower($customer1);					   // permet de mettre le nom saisi du custom en minuscule pour pouvoir correspondre au nom du logo
 
?>


<div id="image">

<!-- Affiche l'image correspondante au custom -->
<img src = "Files/<?=$customer1; ?>.jpg" height="140px"  style="vertical-align:middle; "  > 

</div>
<?php	

}	
	if($customer1 == $customer2)
	{	
?>

<br />						<!-- Retour à la ligne -->



<div id="nom">
<?php	
		echo $nom1;		   // Affiche le nom   (1ere colonne du tableau)
		echo $prenom1;          // Affiche le prénom  (2eme colonne du tableau)			
?>

<?php	
	
	}
    else if(($customer1 !== $customer2)) 
	{
?>

<br />						<!-- Retour à la ligne -->	

<?php
	echo $nom1;		   // Affiche le nom   (1ere colonne du tableau)
	echo $prenom1;          // Affiche le prénom  (2eme colonne du tableau)
	?>
</div>

<div class="clear"></div>

 
<br />



Mon CSS :

Code : CSS
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
#nom{

top:0px; 
float: left;
text-align:center;
}
#image{

float: left;
margin-right:60px;
margin-top: 20px;
}
 
.clear { clear:both; }
Publicité # Posté le 22/02/2012 à 14:01:06

Hors ligne ronamazona # Posté le 22/02/2012 à 14:49:37
Pseudo classe, non ? ^^
Avatar
Salut,

Code : CSS
1
2
3
p img {
  vertical-align: top;
}

Code : HTML
1
<p><img src="image.jpg" />Texte</p>
Mon site test CSS3/HTML5 : www.frogweb.fr
Vous cherchez à faire un Menu déroulant ?
Image utilisateur Votre problème est résolu ? Cliquez sur le bouton résolu.
Image utilisateur Cliquez aussi sur le message qui vous a aidé pour que les autres trouvent facilement la réponse.
 
Hors ligne gloops # Posté le 22/02/2012 à 15:08:32

Merci pour ta réponse :)

J'ai modifié mon code, mais ça ne fonctionne pas...

Il faut savoir que j'ai créé des <div> pour associer les noms correspondant au logo, pour les afficher en face.



Voici mon code modifié :

Code : PHP
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<div id="image">

<!-- Affiche l'image correspondante au custom -->
<p><img src = "Files/<?=$customer1; ?>.jpg" height="140px"  style="vertical-align:middle; "  /> 

</div>
<?php	

}	
	if($customer1 == $customer2)
	{	
?>

<br />						<!-- Retour à la ligne -->



<div id="nom">
<?php	
		echo $nom1;		   // Affiche le nom   (1ere colonne du tableau)
		echo $prenom1;          // Affiche le prénom  (2eme colonne du tableau)			
?>

<?php	
	
	}
    else if(($customer1 !== $customer2)) 
	{
?>

<br />						<!-- Retour à la ligne -->	

<?php
	echo $nom1;		   // Affiche le nom   (1ere colonne du tableau)
	echo $prenom1;          // Affiche le prénom  (2eme colonne du tableau)
	?>
</div>
</p>

Retour au forum "HTML / CSS" ou à la liste des forums

Pour accéder à cette section
Connectez-vous !
connexion_rpx