placer une image en desous de mes bouton au centre

ZidaneMessaili

21 mars 2018 à 2:42:24

bonjour je suis entraint de cree un site pour aider un ami mais je sais pas comment placer ma photo au centre mais en dessous des bouton et par conséquent du titre. voici le code css et la photo actuelle du site: merci beaucoup a ceux qui prennent un peu de temps pour m'aider^^
```
truck{

background-image:url("pcam2.jpg");
background-repeat: no-repeat;
font-size: 80px;
background-image:url("Images/Test_Cadre.JPG");
text-align: center;
bottom: 260px;
margin-left:auto;
margin-right:auto;
float:bottom; 
position:absolute;
bottom: 50;


}
```

Mewen_bzh

21 mars 2018 à 8:49:05

Bonjour,

Tu ne nous fournis malheureusement pas assez d'explications sur ce que tu vex faire et tes codes HTML et CSS actuels.

Voici déjà quelques indications sur le petit bout de code que tu nous montres :

Ligne 1 : truck ce n'est pas une balise standard, si tu veux cibler la classe truck tu dois utiliser .truck dans ton CSS ou #truck si c'est un id,

Lignes 8 et 13 : tu définis deux valeurs pour la propriété bottom, celle située plus bas dans le fichier écrase la première donc la ligne 8 n'est jamais appliquée (et heureusement d'ailleurs car 260px c'est énorme comme valeur...),

Ligne 11 : bottom n'est pas une valeur possible de la propriété float, les seules valeurs acceptées par cette propriété sont left, right, none et inherit (https://www.w3schools.com/css/css_float.asp),

Ligne 12 : le position absolute ne va pas avec le float (tu mélanges deux méthodes) et certainement pas utile ici (c'est comme si tu prenais un missile nucléaire pour écraser un moustique).

Je ne réponds pas aux messages privés.

Clément_

21 mars 2018 à 8:52:24

Bonjour,

Je ne suis pas sûr d'avoir compris, tu souhaites que ton images sois comme à l'heure actuelle mais juste en dessous de tes boutons ainsi que ton titre ?

Si tel est le cas, il te suffira dans ton code html de placer ton image (balise <img>) après ton titre et après tes boutons.

Si ce n'est pas cela que tu cherches je voudrais bien quelques explications supplémentaires ainsi que ton code html stp

Clément

ZidaneMessaili

21 mars 2018 à 18:25:43

bonjour mewen et clement merci pour vos explication ca ma aider et voici mon code html:

merci mewen tu ma appris de mes erreur ,merci beaucoup^^

clement ce que je demandais c'est que la photo soit en dessous des boutton et au centre ,tu vois c'est la photo de presentation^^ voila, merci beaucoup pour votre aide

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset=utf-8>
<link rel="stylesheet" href="new.css" />
<title>ASSOCIATION PCAM</title>
   </head>

  <body>  
  <div class = "truck">
    <img src="pcam2.jpg" alt="Photo de montagne" 
	</div>
	
   <h1> ASSOCIATION PCAM    </h1>
<button class="bou1">accueil</button>

<button class="bou3">jury</button>
<button class="bou4">enfant candidat</button>
<button class="bou5">tamazgha </button>
<button class="bou6">tifinagh </button>

<button class="bou7">video</button>
<button class="bou8">adhesion </button>
<button class="bou9">contact </button>



   
</body>



	</html>

-
Edité par ZidaneMessaili 21 mars 2018 à 18:43:52

Kaidan

22 mars 2018 à 23:09:24

Moi perso, si tu as l'intention de crée un site internet... J'te conseil de suivre les Tutoriels disponible sur le site, sa te fera gagner du temps, surtout sur des truc aussi évidents(le temps d'attendre la réponse t'aurais déjà fait la moitié des cours HTML5/CSS3) et de faire un site propre qui ne ressemble pas au net d'il y a trente ans (manque plus que la fonction blink et t'y es)... Au cas où, la réponse t'as été donnée plus haut, le code ce lit de gauche à droite et de haut en bas...