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
