Forum : Problème affichage d'une image en CSS

Bonjour,
J'ai un problème depuis quelques jours sur mon code CSS, je suis entrain de crée un site web profesionnelle et j'avais réussi à afficher une image principale sur le haut de mon site puis du jour au lendemain elle ne s'affichait plus, il y avait un écran blanc. Donc je pense que quelque chose à changer sur mon code mais je ne sais pas quoi. Je vous met à la suite la ligne de mon code:
CODE HTML:

<div id="imagePrincipale">
            <h1>Séniors 2.0 Services</h1>
            <div id=premierTrait></div>
            <h3>Aux services des intergénereux</h3>
        </div>

CODE CSS:

#imagePrincipale {
    padding-top: 60px;
    background: url(Photo_Couv4.jpg) no-repeat fixed 50% 50%;
    background-size: cover;
    height: 799px;
}

Si jamais je peux vous afficher le haut de mon site web montrer ce que cela affiche et éventuellement afficher des parties de mon code. Merci d'avance pour vos éventuelles réponses !

lhapaipai

Salut Billiwing,
Sur ce que tu montres je ne vois pas d'erreur. ton site est en ligne ? tu peux nous donner l'adresse ? sinon regarde sur ta console de développement pour savoir si le problème est de l'ordre :

que l'image n'arrive pas à se charger (genre erreur 404)
ou bien du css.

Billiwing

Auteur

Salut,
Non mon site n'est pas en ligne et n'est pas hébergé. Ce qui est bizzare c'est que les autres images s'affichent. Ce n'est pas une erreur 404 car j'ai essayé avec d'autres images et impossible aussi... J'ai juste essayé de l'hébergé avec l'hebergeur gratuit Planethoster mais je ne suis pas aller jusqu'au bout car ça n'avait pas marché, peut être cela est du à ça mais je ne suis pas du tout sur.

lhapaipai

et bien justement si ça ne marche pas avec les autres images ça ressemble à une erreur 404, genre tu as déplacé ton dossier d'image ou ton dossier de feuilles de style...
tu ne veux pas nous envoyer une capture de l'onglet Réseau des outils de dev ? sinon je peux pas trop t'en dire plus.

Mickael Christine

Bonjour,

Ton image se trouve t'elle dans un dossier autre que ton fichier css ?
Si oui il faut peut être lui indiquer le chemin jusqu'à l'image et non juste son nom.
Je donne un exemple d'architecture de ton projet:

    MonProjet // dossier
    |__images // dossier
        |__background // dossier
            |__Photo_Couv4.jpg
    index.html
    style.css

La tu vas devoir allez jusqu'a ton image dans ton css

        #imagePrincipale {
            padding-top: 60px;
            // background-image à la place de backround
            background-image: url('./images/background/Photo_Couv4.jpg') no-repeat fixed 50% 50%;
            background-size: cover;
            height: 799px;
        }

Billiwing

Auteur

Non mon image est pas un autre dossier j'avais déjà vérifié. C'est pour ça que je comprend pas vraiment... Excuse moi mais c'est quoi l'onglet réseau des outils dev ?

Billiwing

Auteur

Le problème est résolu ! J'avais 2 fichiers css je sais pas pourquoi et du coup il fallait que j'en supprime un, merci encore pour votre patience :)

Problème affichage d'une image en CSS

6 réponses