Aller au contenu

Background qui ne se répète pas

pob_klk

Par pob_klk
dans (X)HTML et CSS

 Partager

Sujets conseillés

pob_klk

pob_klk

Posté
Posté (modifié)

Bonjour,

j'ai comme vous vous en doutez un petit problème.

Le problème est que si le contenu affiché dans mon div dépasse le cadre de la page et que donc le scroll se met en place, si je descend, le background ne descend pas jusqu'en bas.

(Le problème ne se pose que sous firefox et IE7 étant donné qu'IE6 a une feuille dédiée à cause de la transparence des PNG)

Un lien sera je pense plus parlant : http://clan.nintendo.free.fr/alsacreations...iere_pulsee.php

Voici le code de ma page : 

<!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" xml:lang="fr" >
	<head>
		<title></title>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

		<!-- Ici un petit hack css pour permettre d'afficher convenablement le design
		Le premier hack cache style.css à IE
		Le deuxième hack montre ie.css à IE (feuille de style spécialement dédiée à IE6)
		Le troisième hack montre style.css à IE7-->

		<!--[if  !IE]> <-->
		<link href="style/style.css" rel="stylesheet" type="text/css" />
		<!--> <![endif]-->


		<!--[if lte IE 6]>
		<link rel="stylesheet" media="screen" type="text/css" title="Design" href="style/ie.css" />
		<![endif]-->

		<!--[if IE 7]>
		<link rel="stylesheet" media="screen" type="text/css" title="Design" href="style/style.css" />
		<![endif]-->

		<link href="style/menu.css" rel="stylesheet" type="text/css" />


	</head>

	<body>

		<div class="contenu">

			<div class="contenu_centre">


<div class="menu">

<table class="menu_tableau">
<tr>

<td class="cellule_menu">
<div class="presentation">
<a href="index.php"><img src="images/menu/transparent.gif"></a>
</div>
</td>

<td class="cellule_menu">
<div class="prestations">
<a href="prestations.php"><img src="images/menu/transparent.gif"></a>
</div>
</td>

<td class="cellule_menu">
<div class="aubade">
<a href="aubade.php"><img src="images/menu/transparent.gif"></a>
</div>
</td>

<td class="cellule_menu">
<div class="lumiere_pulsee">
<a href="lumiere_pulsee.php"><img src="images/menu/transparent.gif"></a>
</div>
</td>

<td class="cellule_menu">
<div class="contact">
<a href="contact.php"><img src="images/menu/transparent.gif"></a>
</div>
</td>

</tr>
</table>

</div>

<div class="logo">
		<!--[if  !IE]> <-->
		<img src="images/logo.png" />
		<!--> <![endif]-->

		<!--[if lte IE 6]>
		<img src="images/logo_ie.gif" /a>
		<![endif]-->

		<!--[if IE 7]>
		<img src="images/logo.png" />
		<![endif]-->

</div><div class="centre">

<center>
		<!--[if  !IE]> <-->
		<img src="images/categories/lumiere_pulsee.png" /><br />
		<!--> <![endif]-->

		<!--[if lte IE 6]>
		<img src="images/categories/lumiere_pulsee_ie.gif" /><br />
		<![endif]-->

		<!--[if IE 7]>
		<img src="images/categories/lumiere_pulsee.png" />
		<![endif]-->
</center>
	</div>


			</div>


		</div>

	</body>

</html>

Et le code css : 

a img
{
border: 0px;
}

html
{
height: 100%;
}

body
{
height: 100%;
background-image: url(../images/background.png);
background-repeat: repeat-x;
background-color: rgb(10,0,1);
margin: 0px;
padding: 0px;
}

a
{
text-decoration: underline;
color: white;
font-size: 10pt;
}

a:hover
{
text-decoration: none;
}

.contenu
{
min-height: 100%;
width: 760px;
height: 100%;
background-image: url(../images/fond_contenu.png);
background-repeat: repeat-y;
margin:auto;
}

.contenu_centre
{
margin-left: 20px;
margin-right: 20px;
}

.centre
{
width: 700px;
margin: auto;
color: white;
font-family: verdana, arial, serif;
font-size: 10pt;
text-align: justify;
}

Merci d'avance

Modifié par pob_klk
Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
 Partager
Aller sur la liste des sujets
×
×
  • Créer...