[resolu]introduction d'un script php qui foire le CSS

introduction d'un script php qui foire le CSS [resolu] - HTML/CSS - Programmation

Marsh Posté le 22-08-2008 à 08:34:15    

Salut,
Comme vous avez pu le lire dans le titre, mon CSS qui fonctionne très bien en temps normal plante lorsque j'ajoute du php...
La partie qui plante est le bas_de_page. Le site n'étant pas encore uploader je ne peu pas vous le montrer. A défaut voici le code.
 

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
  3. <head>
  4.  <title>CDH-Hastière - Belgium</title>
  5.  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6.  <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
  7.  <link rel="stylesheet" media="screen" type="text/css" title="Theme" href="theme.css" />
  8. </head>
  10. <body>
  12. <div id="body_page">
  13.  <div id="haut_de_page">
  14.   <?php
  15.   include ("entete.php" )
  16.   ?>
  17.  </div>
  19.  <div id="conteneur">
  21.   <div id="menu_gauche">
  22.    <?php
  23.    include ("menu_gauche.php" )
  24.    ?>
  25.   </div>
  27.   <div id="menu_droit">
  28.    <?php
  29.    include ("menu_droit.php" )
  30.    ?>
  31.   </div>
  33.   <div id="centre_de_page">
  34.    <?php
  35.    $pages_ok = array('accueil' => 'accueil.php', 'liens' => 'liens.php');
  36.    if (in_array($_GET['page'], $pages_ok)) {
  37.    include $_GET['page'].'.php';
  38.    } else {
  39.    header ('HTTP/1.1 404 Not Found');
  40.    die();
  41.    }
  42.    ?>
  43.   </div>
  45.  </div>
  47.  <div id="bas_de_page">
  48.    <?php
  49.    include ("copyright.php" )
  50.    ?>
  51.  </div>
  53. </div>
  56. </body>
  57. </html>


 

Code :
  1. /* ---> Page de CSS pour le site cdH-Hastière <---*/
  3. body
  4. {
  5.     width: 100%;
  6. margin: 0; /* pour éviter les marges */
  7. text-align: center;
  8. background-color: yellow;
  9. background-image: url("images/background.png" ); /* image de fond */
  10. background-repeat: repeat-x;
  11. font: 0.8em "Trebuchet MS", helvetica, sans-serif ; /* police par défaut */
  12. }
  14. #body_page
  15. {
  16. border: none;
  17. margin: auto;
  18. margin-top: 20px;
  19. margin-bottom: 0px;
  20. height: 100%;
  21. width: 984px;
  22. text-align:left;
  23. background-color: none;
  24. }
  26. #haut_de_page
  27. {
  28. margin-bottom: 0px;
  29. height: 180px;
  30. width: 984px;
  31. background-color: none;
  32. background-image: url("images/banniere.png" );
  33. background-repeat: no-repeat;
  34. }
  36. #conteneur
  37. {
  38. height: 620px;
  39. width: 984px;
  40. background-color: none;
  41. margin-bottom: 0px;
  42. background-color: none;
  43. }
  45. #menu_gauche
  46. {
  47. float: left;
  48. height:620px;
  49. width: 180px;
  50. background-color: white;
  51. background-image: url("images/lateralg.png" );
  52. background-repeat: repeat-y;
  53. }
  55. dl, dt, dd, ul, li  .menu
  56. {
  57. margin: 0;
  58. margin-top: 0px;
  59. padding: 0;
  60. list-style-type: none;
  61. }
  63. .menu img
  64. {
  65. border:none;
  66. }
  68. .menu dt
  69. {
  70. list-style-image: url("images/leftpuce2.png" );
  71. }
  73. .menu
  74. {
  75. position: relative;
  76. top: 0;
  77. left: 20px;
  78. }
  80. dl.menu
  81. {
  82. width: 140px; /*taille des cadres menu*/
  83. list-style-image: url("images/leftpuce2.png" );
  84. }
  86. dl.menu dt
  87. {
  88. cursor: pointer; /*remplace flèche par main*/
  89. margin: 2px 0; /*ecart entre les cadres menus*/
  90. height: 20px; /*hauteur des cases menus*/
  91. line-height: 20px;
  92. text-align: left; /*texte menu aligné à droite*/
  93. padding-left: 00px; /*deplacement vers la droite du texte du menu*/
  94. /*font-weight: bold;*/ /*texte menu en gras*/
  95. /*border: 1px solid gray;*/
  96. background: none; /*couleur de fond des menus fermé*/
  97. color: white; /*texte couleur blanche*/
  99. }
  101. dl.menu dd
  102. {
  103. padding-left: 20px;
  104. /*border: 1px solid gray;*/
  105. }
  107. dl.menu li
  108. {
  109. text-align: left;
  110. margin-left: 20px;
  111. background: none; /*couleur de fond des menus ouvert*/
  112. }
  114. dl.menu li a, dl.menu dt a {
  115. color: white; /*couleur pour les liens actif*/
  116. text-decoration: none; /*supprime le surlignement des liens*/
  117. display: block;
  118. border: 0 none;
  119. height: 100%;
  120. }
  122. dl.menu li a:hover, dl.menu dt a:hover {
  123. background: red; /*couleur de surlignement au passage de la souris*/
  124. }
  126. #menu_droit
  127. {
  128. float:right;
  129. height: 620px;
  130. width: 180px;
  131. background-color: orange;
  132. background-image: url("images/laterald.png" );
  133. }
  135. #centre_de_page
  136. {
  137. height: 620px;
  138. margin-right:180px;
  139. margin-left: 180px;
  140. background-color: green;
  141. }
  143. #bas_de_page
  144. {
  145. margin-top: 0px;
  146. margin-bottom: 4px;
  147. height: 80px;
  148. width: 984px;
  149. background-color: black;
  150. }


 

Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//FR" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
  3. <head>
  4. <title>un menu déroulant en CSS et javascript</title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6. <link rel="stylesheet" media="screen" type="text/css" title="Theme" href="theme.css" />
  8. <script type="text/javascript">
  9. <!--
  10. window.onload=montre;
  11. function montre(id) {
  12. var d = document.getElementById(id);
  13. for (var i = 1; i<=10; i++) {
  14.  if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
  15. }
  16. if (d) {d.style.display='block';}
  17. }
  18. //-->
  19. </script>
  21. </head>
  23. <body>
  25. <dl class="menu">
  26. <h3>cdH-Hastière</h3>
  27.  <dt onclick="javascript:montre('smenu1');"><a href="index.php?page=accueil"><img src="images/leftpuce2.png" alt="puce"/>  Accueil</a></dt>
  29.  <dt onclick="javascript:montre('smenu2');"><a href="#"><img src="images/leftpuce2.png" alt="puce"/>  Agenda</a></dt>
  30.   <dd id="smenu2">
  31.    <ul>
  32.     <li><a href="#">Année en cours</a></li>
  33.     <li><a href="#">Archives</a></li>
  34.    </ul>
  35.   </dd>
  37.  <dt onclick="javascript:montre('smenu3');"><a href="#"><img src="images/leftpuce2.png" alt="puce"/>  Actualité</a></dt>
  39.  <dt onclick="javascript:montre('smenu4');"><a href="#"><img src="images/leftpuce2.png" alt="puce"/>  Publications</a></dt>
  40.   <dd id="smenu4">
  41.    <ul>
  42.     <li><a href="#">Année en cours</a></li>
  43.     <li><a href="#">Archives</a></li>
  44.    </ul>
  45.   </dd>
  47.  <dt onclick="javascript:montre('smenu5');"><a href="#"><img src="images/leftpuce2.png" alt="puce"/>  Comité et Contacts</a></dt>
  49.  <dt onclick="javascript:montre('smenu6');"><a href="#"><img src="images/leftpuce2.png" alt="puce"/>  Présentation du cdH</a></dt>
  50.   <dd id="smenu6">
  51.    <ul>
  52.     <li><a href="#">Local</a></li>
  53.     <li><a href="#">National</a></li>
  54.    </ul>
  55.   </dd>
  57.  <dt onclick="javascript:montre('smenu7');"><a href="#"><img src="images/leftpuce2.png" alt="puce"/>  L'arrondissement</a></dt>
  59.  <dt onclick="javascript:montre('smenu8');"><a href="index.php?page=liens"><img src="images/leftpuce2.png" alt="puce"/>  Liens</a></dt>
  61.  <dt onclick="javascript:montre('smenu9');"><a href="#"><img src="images/leftpuce2.png" alt="puce"/>  Contacts</a></dt>
  63. </dl>
  65. </body>
  66. </html>


 
Je n'ai pas mis tt les includes ca n'aurait pas servi. Si quelqu'un à une idée pr empêcher mon bas de page de disparaitre. (les couleurs vous choque... normal elle me serve à différencier les blocs)
 
Au passage si quelqu'un sait me dire si il est possible de coller une puce devant chaque "dt" dans mon menu je serais intéressé, pcq pr le moment ca fait vraiment bordel dans mon code (une idée CSS)
 
Merci


Message édité par Sephirius2 le 22-08-2008 à 12:39:40
Reply

Marsh Posté le 22-08-2008 à 08:34:15   

Reply

Marsh Posté le 22-08-2008 à 12:39:23    

Problème résolu

Reply

Marsh Posté le 18-02-2009 à 16:37:16    

Salut,
 
Peux-tu nous dire ce que tu as corrigé ? Le "bon" nous intéresse plus que ta longue liste de code erroné ;-)
 
Merci

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed