[CSS] Problème de positionnement

Problème de positionnement [CSS] - Divers - Programmation

Marsh Posté le 17-10-2004 à 09:00:49    

Bonjour à tous !
 
Voilà, depuis hier je suis confronté à un problème que je n'arrive pas à résoudre au sujet des positionnement de calques en CSS.
 
Je cherche tout simplement à centrer le contenu du site sur la page.
 
Voici mon code CSS:
 

Code :
  1. body
  2. {
  3. background-color: #CCCC99;
  4. text-align:center;
  5. margin:0;
  6. }
  7. #page
  8. {
  9. position:absolute;
  10. margin-left: auto;
  11.     margin-right: auto;
  12. width: 750px;
  13. border: 1px solid #000000;
  14. background-color: #FFFFFF;
  15. text-align:left;
  16. }
  17. #contenu
  18. {
  19. background: #FFFFFF;
  20. position:relative;
  21. margin-top:10px;
  22. margin-left:230px;
  23. width:500px;
  24. font-family: Verdana;
  25. font-size: 10pt;
  26. color: #000000;
  27. }
  28. #menu
  29. {
  30. background-color: #EEEEEE;
  31. border-color: #000000;
  32. border-style: solid;
  33. border-width: 1px;
  34. font-family: Verdana;
  35. font-size: 12px;
  36. color: #000000;
  37. padding: 5px 5px;
  38. position:relative;
  39. top:-1px;
  40. left:-1px;
  41. width:200px;
  42. }
  43. #ombre_menu
  44. {
  45. background: #999999;
  46. position:relative;
  47. margin-top:-10px;
  48. margin-left:5px;
  49. width:212px;
  50. float:left;
  51. }
  52. #entete
  53. {
  54. background-color: #88909D;
  55. border-color: #000000;
  56. border-style: solid;
  57. border-width: 1px;
  58. margin-left: -1px;
  59. margin-top: -1px;
  60. margin-right: -1px;
  61. height:110px;
  63. }


 
Et mon code HTML:
 

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <title>Document sans titre</title>
  5. <link rel=stylesheet type="text/css" href="styles.css">
  6. </head>
  7. <body>
  8. <div id="page">
  9.  <div id="entete">
  10.   <div id="date"></div>
  11.   <a href="index.php"><h1></h1>
  12.   <h2></h2> </a>
  13.     </div>
  14.  <div id="ombre_menu">
  15.   <div id="menu">texte</div>
  16.  </div>
  17. <div id="contenu">
  18. texte
  19. </div>
  20. </body>
  21. </html>


 
Donc à savoir que si je passe l'absolute de #page en relative, la page se trouve correctement centrée mais à ce moment là, la hauteur de page ne s'adapte plus en fonction de son contenu....
 
Quel casse tête...
 
Avez vous une idée ?
 
Merci pour votre aide !


Message édité par huggy le 17-10-2004 à 09:02:20
Reply

Marsh Posté le 17-10-2004 à 09:00:49   

Reply

Sujets relatifs:

Leave a Replay

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