creer un contenuer, il ne s'affiche pas

creer un contenuer, il ne s'affiche pas - HTML/CSS - Programmation

Marsh Posté le 12-04-2009 à 17:15:44    

bonjour a  tous, je suis entrain de creer un site internet, le header est mis, un exemple de texte,
un background, mais j'aimerais faire un conteneur(je crois que ca s'appele comme ca), le rectangle en blanc au milieu de cette page. http://playmusculation.olympe-network.com/
je refais tout un design, j'ai crée l'image que je veux mettre en conteneur(bga.png) j'ai essayé de l'inserer, mais ej dois mal faire les choses, ou je n'ai pas le bon script.
voici ce que j'ai pouyrl'instant, que dois-je inscrire et ou pour faire apparaitre mon conteneur ? il fait 913px de large, la racine : (images/interface/bga.png)
 
voici le code html :

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>Play-musculation</title>
  5.         <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6.         <link rel="shortcut icon" href="favicon.gif" type="image/ico" />
  7. <link rel="stylesheet" type="text/css" href="style.css" title="default" media="screen" />
  8. </head>
  9. <body>
  10. <div id="global">
  11.  <!-- Début du header, ici sera affiché le header et les différents liens qu'il contient -->
  12. </div>
  13. <div id="header">
  14.   <h1>Play-musculation</h1> <!-- Modifier le titre, même s'il n'apparaît pas sur le webdesign -->
  15. </div>
  16.  <!-- Début du contenu, c'est ici que le contenu de votre site est affiché -->
  17.  <div id="contenu">
  18.   <h2><br>Vive play musculation</br></h2>
  19.   <p>
  20.      <br>
  21.      Premier test du site play musculation, c'est pas bau, c'est pourri meme,
  22.      mais je ne peux m'enmpecher d'etre heureux de l'avoir crée
  23.      </br>
  24.   </p>
  25.   <p>
  26.      <br><br><br><br> Dans ce site il y aura :</br></br></br></br>
  27.   </p>
  28.   <p>
  29.      <br>
  30.          <ul>
  31.                         <li>une catégorie débutant</li>
  32.                         <li>une catégorie materiel</li>
  33.                         <li>une catégorie blessures</li>
  34.      <li>...</li>
  35.                    </ul>
  36.    
  37.      </br>
  38.  </div>
  39.  <!-- Début du footer -->
  40.  <p id="footer">Interface graphique par <a href="#">Maxime</a> pour <a href="http://play-musculation.com/">play-musculation</a></p>
  41. </div>
  42. </body>
  43. </html>


 
et voici le code css :

Code :
  1. *{ margin: 0; padding: 0; }
  2. body {
  3. width: 913px;
  4. margin: auto;
  5. background: #1d1d1d url(images/interface/bg.png) repeat-x;
  6.     background-attachment: url(images/interface/bga.png);
  7. font-family: Arial, Verdana, Helvetica, sans-serif;
  8. color: #000;
  9. font-size: 10pt;
  10. }
  11. img {
  12. border: none;
  13. }
  14. a {
  15. text-decoration: none;
  16. color: #000;
  17. }
  18. a:hover {
  19. border-bottom: 1px dotted #fff;
  20. }
  21. /* CSS de la partie extensible en hauteur  
  22. -----------------------------------------------------*/
  23. #global { 
  24. background: url(images/interface/extensible.png) repeat-y;
  25. }
  26. /* CSS du header  
  27. -----------------------*/
  28. #header { 
  29.     width: 913px;
  30. height: 233px;
  31. background: url(images/interface/header.png) no-repeat;
  32. margin-bottom: 10px;
  33. text-align: center;
  34. padding-top: 2px;
  35. }
  36. #header h1{
  37. display: none;
  38. }
  39. #header ul { 
  40. display: inline;
  41. }
  42. #header li { 
  43. display: inline;
  44. list-style: none;
  45. margin-right: 20px;
  46. }
  47. /* CSS du contenu
  48. ------------------------ */
  49. #contenu {
  50. margin: -25px 15px 15px 15px;
  51. }
  52. #contenu p {
  53. padding: 0 0 0.5em 0;
  54. }
  55. h2 {
  56. padding: 0 0 0.5em 0;
  57. font-size: 1.2em;
  58. }
  59. /* CSS du footer  
  60. ------------------------*/
  61. #footer {
  62. clear: both;
  63. width: 913px;
  64. height: 22px;
  65. background: url(images/interface/footer.png) no-repeat;
  66. font-size: 8pt;
  67. text-align: center;
  68. color: #fff;
  69. }


 
ne vous foutez pas de moi, je débute, donc ca doit etre super mal organisé....

Message cité 1 fois
Message édité par No-fonte le 12-04-2009 à 17:16:40
Reply

Marsh Posté le 12-04-2009 à 17:15:44   

Reply

Marsh Posté le 14-04-2009 à 19:08:57    

up

Reply

Marsh Posté le 14-04-2009 à 19:28:02    

Et sinon, c'est quoi ton problème exactement ? Tu veux faire un "conteneur" ?
 
C'est quoi un "conteneur" pour toi ? Bref, décris ce que tu veux faire et remet ton site en ligne, parce que pour le moment, je ne vois qu'un lien vers "nouvelle fransai.odt"  :sweat:

Reply

Marsh Posté le 14-04-2009 à 19:51:43    

je veux faire comme la :
http://www.jeuxvideo.com/etajvbis.htm
 
je croyais que ca s'appelait comme ca, en fait c'est un cadre ou se passe tout le site (en occurence sur jv.com c'est le truc du milieu)

Reply

Marsh Posté le 15-04-2009 à 08:55:59    

Citation :

nouvelle fransai.odt

[:rofl2]  

No-fonte a écrit :

ne vous foutez pas de moi, je débute

[:clooney8]  
Trêve de plaisanterie : je n'ai pas très bien compris ton problème
Un conteneur c'est un élement qui contient des sous élements. J'ai l'impression que toi, tu parles d'un background, non ? Et il ne s'affiche pas, c'est çà ?

Reply

Marsh Posté le 15-04-2009 à 13:36:41    

ben en fait on m'a dit que ca s'appelait comme ca mais...
 
en fait, le background, comme vous le voyez sur le screen(d'ailleurs la qualité de merde quand je fais un screen :o ) e ben il y est. mais moi je veux faire une sorte de "deuxième" background ou se passe tout le  site, un site fixe quoi.
http://img27.imageshack.us/img27/4874/sitej.jpg
http://img27.imageshack.us/img27/sitej.jpg/1/w1616.png
 

Reply

Marsh Posté le 15-04-2009 à 14:01:39    

t'as qu'à appliquer un background à la div qui contient ton texte [:spamafote]

Reply

Sujets relatifs:

Leave a Replay

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