Discussion :

[BR2FR]

Je viens de coder mon premier site, en revanche je n'arrive pas à insérer les images en arrière plan par le biais du CSS.

Du coup, j'ai du les ajouter au code html comme images normales. Le problème est que elles ont une borde noire du au fond de la balise div, et je ne sais pas comment ajouter du texte sur elles...

Quelqu'un peut m'aider? Pourquoi les images sur le CSS ne marchent pas??

Merci

[ornitho13]

Peut être est ce dû au fait que le serveur ne les trouve pas, ou alors cela vient de ta syntaxe CSS.

As tu un bout de code CSS pour que l'on puisse se rendre compte de ton problème? ou alors un lien vers ton site?

[BR2FR]

Merci Jêrome! Quel réactivité

Excuses moi, j'ai oublié de mettre le lien !

www.regards-photographie.com

En arrivant à la maison, je chercherai le code qui ne marchait pas pour en poster ici!

merci beaucoup!

[ornitho13]

Pas de souci

D'après ce que je vois, quand on clique sur un de tes menu, une div de class "frame" apparait avec donc l'image en html plutôt qu'en fond d'écran, c'est cela?

pour ajouter cette image dans ton css, voici ce que tu dois faire :

Code css du fichier style.css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
 
.container .content .frame {
     width: 430px;
     height: 280px;
     position: relative;
     left: 355px;
     top: 100px;
     color: #000;
     background: black url(../images/enfants.png) no-repeat;
}

tes images étant dans un répertoire "images" situé au même niveau que le répertoire "styles", tu dois remonter d'un niveau pour obtenir ton image (../images/nom_de_ton_image.extension).

Ainsi ton div n'a plus besoin de tag <img /> :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
<div class="frame">
    <p>je mets le texte que je veux</p>
</div>

Tu verras que j'ai modifié la largeur et la hauteur de ta div .frame car dans la feuille de style "onColFixCtrHdr.css", tu as du padding et cela va se rajouter à la hauteur et la largeur de ton div.frame et donc on verra la couleur noire.
J'ai modifé un peu ton padding pour en rajouter sur les cotés droit et gauche afin qu'il y ait un espace entre le bord de ta div et le texte éventuel que tu mettras à l'intérieur :

Code css du fichier onColFixCtrHdr.css :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
 
.container .content .frame {
    padding: 10px;
    background: #CCC49F;
}

[BR2FR]

Merci, je vais réaliser les changements. Oui en effet, je préfère utiliser les images comme fond plutôt que comme image sur le html.

J'avais crée un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
.container .content .frame {background: black url(../images/enfants.png) no-repeat;
}

sur une feuille de style enfants.css , car je voudrais que les images changent quand on clic sur les liens, et je ne sais pas comment faire avec la feuille style.css . Mais ça n'a pas marché...

Bien joué pour la padding, je n'avais pas remarqué cela!

Merci encore une fois!