Descendre une image en CSS

[Fermé]
Signaler
-
 chihua -
Bonjour,

J'ai un probleme avec css. J'ai réussi à mettre le header et le menu. Mais lorsque je veux mettre le slider j'ai un probleme.
J'ai dans mes images, une image appelée slider (qui représente véritablement mon slider c'est à dire une photo un texte et les fleches. Et j'ai aussi une autre image qui s'appelle slider_fond qui représente le fond de mon slider, j'entends par la que l'image slider fait 940px et slider_fond est plus large afin que ça soit adapté pour tous les écrans.
Donc voici mon code html :
 <div id="slider">
<div class="image_slider">
</div>

Et css :
#slider{
background: url("Images/slider_fond.jpg");
width: 100%;
height:412px;
}

#slider .image_slider{
background: url("Images/slider.jpg");
width:940px;
height:322px;
margin-left: 180px;
}


Le margin-left centre à peu près mon slider sur le slider_fond. Actuellement lorsque je regarde le résultat sur Firefox le slider est tout en haut du slider_fond.
Et je n'arrive pas à le descendre, si je met margin-top ça me descend slider et slider_fond, et j'ai une marge blanche, et si je met padding-top ça ne change rien du tout... J'ai essayé de chercher mais je ne trouve pas. Si vous pouviez m'aider svp
Merci d'avance

1 réponse

Messages postés
75
Date d'inscription
mercredi 15 décembre 2010
Statut
Membre
Dernière intervention
14 octobre 2015
16
Bonsoir cochi,

Pour commencer tu peux centrer ton .image_slider avec l'attribut
margin: 0 auto;
cela centrera ton bloc .image_slider horizontalement.

Maintenant si tu désire descendre ce bloc je te suggère d'essayer de mettre un
padding-top: taValeur;
sur le bloc #slider. Ainsi ton bloc .image_slider devrais être descendu.

--
Bonjour,
Déjà merci pour ta réponse. J'ai essayé donc mon image est bien centré horizontalement. Mais peu importe quelle valeur je mets dans le pudding - top il n'y a aucun changement..