Image de fond

**philippef** · 18/11/2014, 21h02

Bonjour,

J'ai un soucis avec une image de fond.
l'image est bien sur le site mais derrière les <div>
Par exemple sur le fichier qui contient les photos le fond de la div et de la table est blanc. On ne voit pas l'image de fond

donc si quelqu'un peut me dire où se trouve l'erreur ce serait bien sympa.

voici l'architecture du site.
le fichier index.php

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Association culturelle</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="description" content="Troissy"/>
<meta name="keywords" content=" "/>
<meta name="Author" lang="fr" content=""/> 
<meta name="Robots" content="index, follow, all"/>
<meta name="Revisit-after" content="5 days"/>
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script type="text/javascript" src="scripts/scripts.js"></script>
</head>
<body style="background-image:url(images/vigne1.jpg); background-repeat:no-repeat;">
	<div id="bandeau">
le code
	</div>
	<div id="menu">
le menu situé à gauche
	</div>
	<div id="contenu">
les pages contenant des <div>
	</div>
 
</body>
</html>

le fichier CSS

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
body {
	margin:0px;
  	background: url(images/vigne1.jpg) no-repeat center fixed; 
  	-webkit-background-size: cover; /* pour Chrome et Safari */
  	-moz-background-size: cover; /* pour Firefox */
  	-o-background-size: cover; /* pour Opera */
  	background-size: cover; /* version standardisée */
	}
div#bandeau {
	width:100%;
	height:179px;
	background-color:#A52A2A;
	}
div#menu {
	float:left;
	width:170px;
	height:650px;
	background-color:#A52A2A;
	}
div#contenu {
	float:left;
	margin-left:25px;
	margin-top: 25px;
	width:900px;
	background-color:#FFFFFF;
	font-family:verdana;
	font-size:12px;
	}

le fichier qui contient des photos

Code html :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<div id="table-images">
<table  id="petits-formats" align="center">
	<tr height="30px">
		<td colspan="2" style="text-align:center; font-size:15px"><a href="index.php?page=panorama" class="blue">Afficher le diaporama manuel</a></td>
 
		<td colspan="2" style="text-align:center; color:brown; font-size:15px">Cliquez sur une photo pour l'agrandir</td>
	</tr>
	<tr class="centrer">
		<td><img src="images/photos_anciennes/panorama1_pm.jpg" alt="" onclick="javascript:show('1');"> Panorama </td>
		<td><img src="images/photos_anciennes/chateau_pm.jpg" alt="" onclick="javascript:show('2');"><br>Le château</td>
		<td><img src="images/photos_anciennes/eglise_pm.jpg" alt="" onclick="javascript:show('3');">L'église</td>
		<td><img src="images/photos_anciennes/eglise_apres_guerre_pm.jpg" alt="" onclick="javascript:show('4');">L'église après la guerre</td>
	</tr>
</table>
</div>
<div id="images" align="center">
	<img src="images/photos_anciennes/panorama1_gm.jpg" alt="" id="1" border="7" onclick="javascript:hide('1');">
	<img src="images/photos_anciennes/chateau_gm.jpg" alt="" id="2" border="7" onclick="javascript:hide('2');">
	<img src="images/photos_anciennes/eglise_gm.jpg" alt="" id="3" border="7" onclick="javascript:hide('3');">
	<img src="images/photos_anciennes/eglise_apres_guerre_gm.jpg" alt="" id="4" border="7" onclick="javascript:hide('4');">
</div>

Merci pour l'aide

**philippef** · 18/11/2014, 23h01

A force de regarder mon code j'ai fini par trouver.
forcément en mettant une couleur dans la div contenu ça marche pas.

merci quand même

Image de fond

CSS

Discussions similaires

Partager

Partager