[css] div qui passe sur un autre

div qui passe sur un autre [css] - HTML/CSS - Programmation

Marsh Posté le 30-12-2005 à 16:22:34    

Salut.
J'ai un petit problème de css.
 
En effet j'ai un div qui passe sur le bas de mon site quand le div en question à un contenu qui s'agrandi.
Sous IE ce problème ne se pose pas car le div du bas se met toujours en dessous du div qui peux s'agrandir mais sous mozilla le div passe par dessus.
 
Comment faire pour que le div du bas suive l'agrandissement ou non du div du dessus?
 

Message cité 1 fois
Reply

Marsh Posté le 30-12-2005 à 16:22:34   

Reply

Marsh Posté le 30-12-2005 à 16:50:57    

masseur a écrit :

Salut.
J'ai un petit problème de css.
 
En effet j'ai un div qui passe sur le bas de mon site quand le div en question à un contenu qui s'agrandi.
Sous IE ce problème ne se pose pas car le div du bas se met toujours en dessous du div qui peux s'agrandir mais sous mozilla le div passe par dessus.
 
Comment faire pour que le div du bas suive l'agrandissement ou non du div du dessus?


 
T'aurais pas du code pour qu'on puisse se rendre un peu mieux compte ?

Reply

Marsh Posté le 30-12-2005 à 16:52:16    

Comme souvent, la réponse coule plus facilement de source quand on a le dit source sous les yeux.
Par ce que là, ne sachant pas comment tu positionnes tes div ni comment est organisé ta page, ben on peut pas te dire quoi changer ni ce qui merde.
 
EDIT : on m'a grillé.

Message cité 1 fois
Message édité par omega2 le 30-12-2005 à 16:52:38
Reply

Marsh Posté le 30-12-2005 à 16:56:06    

omega2 a écrit :

Comme souvent, la réponse coule plus facilement de source quand on a le dit source sous les yeux.
Par ce que là, ne sachant pas comment tu positionnes tes div ni comment est organisé ta page, ben on peut pas te dire quoi changer ni ce qui merde.
 
EDIT : on m'a grillé.


 
Grillé peut-être, mais joli jeu de mots ^^

Reply

Marsh Posté le 30-12-2005 à 17:04:38    

Voici le code html.
 

Code :
  1. <div id="le_tout">
  3. <div id="barrehautespace_login_haut">
  4. <div id="barrehaut"></div>
  5. <div id="espace_login_haut">
  6. </div>
  7. </div>
  9. <div id="menu"></div>
  11. <div id="header">
  12. </div>
  14. <div id="barrebleu_haut"></div>
  16. <div id="barrebleu_sous">
  17. </div>
  20. <div id="principal">
  22. <div id="cadre_bleu">
  23.   <div id="bloc_gauche"><div id="bleu_gauche"></div><div id="contenu_gauche">sdfgsdfg</div></div>
  24. <div id="bloc_droite"><div id="bleu_droite"></div><div id="contenu_droite">
  25.   <p>sdfgsdfgs</p>
  26.   <p>h</p>
  27.   <p>h</p>
  28.   <p>h</p>
  29.   <p>h</p>
  30.   <p>h</p>
  31.   <p>h</p>
  32.   <p>df</p>
  33.   <p>fd</p>
  34.   <p>gd</p>
  35.   <p>f</p>
  36.   <p>gd</p>
  37.   <p>f</p>
  38.   <p>g</p>
  39.   <p>df</p>
  40. </div></div>
  41. </div>
  44. <div id="log_pub">
  45. <div id="log"><div id="haut_log"></div><div id="fond_log">fds<BR></BR>fds<BR></BR></div></div>
  46. <div id="pub">pub</div>
  47. </div>
  50. </div>
  52. <div id="bas"></div>
  54. </div>


 
et le css
 

Code :
  1. #le_tout {
  2. width: 944px;
  3. border: 1px solid black;  /*1 OU 2*/
  5. }
  7. #menu {
  8. background-image: url(images/menu.jpg);
  9. background-repeat: repeat-x;
  10. height: 28px;
  11. width:944px;
  12. }
  14. #header
  15. {
  16. background-image: url(images/header.jpg);
  17. height: 79px;
  18. width:944px;
  19. /*prob de taille sous mozilla -> mettre un width avec un conditionnement pour IE*/
  20. }
  22. #barrehautespace_login_haut {
  23. height:30px;
  24. width: 944px;
  25. }
  27. #barrehaut {
  28. background-image: url(images/haut.jpg);
  29. height: 30px;
  30. width: 744px;
  31. float:left;
  32. }
  35. #espace_login_haut {
  36. height:30px;
  37. width:200px;
  38. float:right;
  39. background-color:#00FF00;
  40. }
  42. #barrebleu_haut {
  43. background-image: url(images/barrebleu_haut.jpg);
  44. background-repeat: repeat-x;
  45. height:26px;
  46. width:944px;
  47. }
  49. #barrebleu_sous {
  50. background-image: url(images/barrebleu_sous.jpg);
  51. background-repeat: repeat-x;
  52. height:17px;
  53. width:944px;
  54. }
  57. #principal {
  58. height: 480px;  /* pas mettre taille fixe*/
  59. width: 944px;
  61. }
  66. #cadre_bleu{
  67. width: 663px;
  68. float:left;
  69. margin-top:7px;
  70. }
  73. #bloc_gauche {
  74. margin-left:5px;
  75. float:left;
  76. border: 1px solid #2C82B3;
  77. }
  81. #bloc_droite {
  82. margin-right:6px;
  83. float:right;
  84. border: 1px solid #2C82B3;
  85. }
  87. #bleu_gauche{
  88. background-image: url(images/bleu_gauche.jpg);
  89. height:23px;
  90. width:434px;
  91. }
  93. #bleu_droite{
  94. background-image: url(images/bleu_droite.jpg);
  95. height:23px;
  96. width:208px;
  97. }
  101. #log_pub{
  102. width:275px;
  103. float:right;
  104. margin-top:0px;
  106. }
  108. #log{
  109. float:left;
  110. }
  112. #haut_log{
  113. background-image: url(images/haut_log.jpg);
  114. height:47px;
  115. width:120px;
  117. }
  119. #fond_log {
  120. background-image: url(images/fond_log.jpg);
  121. background-repeat: repeat-y;
  123. }
  125. #pub {
  126. float:right;
  127. width:auto;
  128. }
  130. #bas {
  131. background-image: url(images/bas.jpg);
  132. height:56px;
  133. width:944px;
  134. }
  136. #contenu_droite {
  137. height:auto;
  139. }


 
 
 
C'est donc contenu droite qui passe sur le div bas.


Message édité par masseur le 30-12-2005 à 17:06:34
Reply

Sujets relatifs:

Leave a Replay

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