28112 sujets

CSS et mise en forme, CSS3

Positionnement banner en css

Bonjour , je souhaite placer ma photo (voir pièce jointe) plus bas et à droite (sans coller au bord dtoit) via un banner en css. J'utilise une maquette récupéré sur le web et étant plutôt novice je ne capte pas toutes les subtilités je crois.

#banner {
    background: url("../images/blocs_dark_sky.jpeg") no-repeat right top;
    background-size: 35% 35%;
    background-position: 25% 75%;
}


Je vous remercie par avance pour toute aide.
Bon weekend à tous.
Modérateur
Salut,

Quand tu écris :
background: url("../images/blocs_dark_sky.jpeg") no-repeat right top;

le right top est pour le background-position (background tout court étant un raccourcis de plein de background-xxxx).

Donc la ton code ne retient que :
background-position: 25% 75%;


Si tu veux positionner ton background par rapport au coin top right tu peux l'écrire comme ça :
background-position: top 10px right 20px;


Bonne soirée
Modifié par _laurent (04 Oct 2021 - 23:42)
bonjour

j'ai modifié mon code comme suit :

#banner {
    background: url("../images/blocs_dark_sky.jpeg") no-repeat ;
    background-size: 35% 35%;
    background-position: top 10px right 20px;
}


et le résultat (en pièce jointe) est le même ??? est ce que j'ai mal écrit le code toujours ?

merci beaucoup pour toute aide
cordialement
Andy
Modérateur
Salut,

Pour moi ca fonctionne bien : https://jsfiddle.net/nfjecopb/
L'image est bien a 10px du top et a 20px de la droite et elle fait bien 35% de large et de haut.

Alors quoi y'a un soucis quand tu l'applique, soit c'est pas ce que tu attends Smiley lol

PS : Il n'y a pas ta PJ, il faut penser à cliquer sur le bouton "insérer" après avoir importé l'image

Bonne soirée
Sujet clos
Aller à