Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
2877 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  bloc div flottante droite qui ne prends pas toute la hauteur

 
 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

bloc div flottante droite qui ne prends pas toute la hauteur

n°1561462
zupstyle
Posté le 16-05-2007 à 22:48:30  profilanswer
 

Hello j'ai un problème avec mon code voilà la structure du milieu du forum appeler contenu
 

Code :
  1. <div id="center">
  2.     <!-- bloc contenu de gauche-->
  4.   <div id="left">
  6.       <div id="haut_gauche"></div>
  7.  
  8.       <!-- Contenu principal partie gauche-->
  9.      <div id="contenu_gauche"> Contenu gauche  </div>
  11.       <div id="bas_gauche"></div>
  13.     <!--fin bloc contenu de gauche-->
  14.     </div>
  17.     <!-- bloc contenu de droite-->
  18. <div id="right">
  20.       <div id="haut_droite"></div>
  22.       <!-- Contenu principal partie droite-->
  23.       <div id="contenu_droite"> Contenu droite
  25.       <!-- fin contenu droite-->
  26.      </div>
  28.    
  30.       <div id="bas_droite"></div>
  31.  
  32.       <!-- fin bloc right-->
  33.    </div>
  35.   <!-- fin contenu au centre -->
  36.   </div>


 
 
voilà le CSS

Code :
  1. /********************************************** BLOCS POUR LE CONTENU *****************************************************************/
  2. #center {
  3. /* Pour éviter la superposition  
  4. du pied de page et du contenu : */
  5. padding-bottom: 84px;
  6. overflow: hidden;
  7. width: 100%;
  8. height:100%;
  10. }
  12. #left{
  13. float:left;
  14. width: 600px;
  15. border: 0px;
  16. padding: 0px;
  17. margin: 0px;
  18. }
  20. #right{
  21. float:right;
  22. width: 200px;
  23. border: 0px;
  24. padding: 0px;
  25. margin: 0px;
  27. }
  28. /********************************************** DESIGN POUR LE CONTENU *****************************************************************/
  29. #haut_gauche{
  30. background-image: url(images_bannieres/bg_g_h.png);
  31. background-repeat: no-repeat;
  32. width: 600px;
  33. height: 50px;
  35. }
  37. #contenu_gauche{
  38. background-image: url(images_bannieres/wallpapert.png);
  39. background-repeat: repeat-y;
  40. width: 600px;
  41. padding-left: 40px;
  42. height:100%;
  43. overflow:auto;
  45. }
  47. #bas_gauche{
  48. background-image: url(images_bannieres/bg_g_b.png);
  49. background-repeat: no-repeat;
  50. width: 600px;
  51. height: 50px;
  52. }
  56. #haut_droite{
  57. background-image: url(images_bannieres/bg_p_h.png);
  58. background-repeat: no-repeat;
  59. width: 200px;
  60. height: 50px;
  62. }
  64. #contenu_droite{
  65. background-image: url(images_bannieres/wallpapert_menudroite.png);
  66. background-repeat: repeat-y;
  67. width: 200px;
  68. padding-left: 20px;
  69. height:100%;
  70. overflow:auto;
  72. }
  74. #bas_droite{
  75. background-image: url(images_bannieres/bg_p_b.png);
  76. background-repeat: no-repeat;
  77. width: 200px;
  78. height: 50px;
  80. }


 
 
le problème est que si le contenu de gauche est plus grand que celui de droite, celui de droite donc ne va pas prendre la même hauteur que son confrère, pourtant j'ai mis des height:100%; pour les deux.
Apparemment les deux flottantes prennent leur grandeur par rapport au contenu qui est dedans
moi j'aimerai que si un des deux est plus grand que l'autre ils se configurent pour prendre la meme hauteur vous comprennez ?
en tableaux ca serait simplement un height=100% mais là il prend pas :/


Message édité par zupstyle le 16-05-2007 à 22:49:47

---------------
Mon topic Tiësto
mood
Publicité
Posté le 16-05-2007 à 22:48:30  profilanswer
 

n°1561488
dartyduck
n00b AttitudE
Posté le 17-05-2007 à 00:03:33  profilanswer
 

impose une hauteur fixe en px


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
n°1561489
zupstyle
Posté le 17-05-2007 à 00:13:54  profilanswer
 

pas un autre moyen car si je fais ca je devrais faire un overflow:auto; et la scrollbar j'aimerai éviter
il doit avoir un moyen mais là je sèche ?


---------------
Mon topic Tiësto
n°1561495
dartyduck
n00b AttitudE
Posté le 17-05-2007 à 00:56:56  profilanswer
 

deux choses :
1- si le contenu de ta boite de gauche évolue et augmente, la hauteur augmentera également meme en mettant un height 100%.  
2- si le contenu n'augmentera pas, tu peux figer la hauteur. 100% means que la boite fera la hauteur de la page ou de son parent. Tu peux dans ce cas figer la heuteur des deux blocs (gauche et droite) et harmoniser le tout.
 d'apres ce que tu dis, le contenu évoluera, et donc mettre 100% te mettra l'ascenseur de la page.


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
n°1561499
zupstyle
Posté le 17-05-2007 à 01:11:46  profilanswer
 

donc je dois faire quoi en gros, car mon but est d'éviter absolument l'ascenceur dans ma boite center, ou meme contenu  
je veux juste la scroll bar de la page mais c'est tout, et que les deux bloc de contenu respectivement gauche et droite soient harmoniser et donc de même hauteur avec ou sans contenu
possibilités ?


---------------
Mon topic Tiësto
n°1561534
dartyduck
n00b AttitudE
Posté le 17-05-2007 à 10:28:54  profilanswer
 

alors pourquoi ne pas figer leurs hauteurs à genre 700px, et point barre ! c'est en gros la hauteur d'une page (en 1024x768 résolution la plus courante) et comme ça pas de scrollbar dans ton div


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
n°1561545
zupstyle
Posté le 17-05-2007 à 11:19:10  profilanswer
 

comment ca figer a 700px de hauteur ? si le contenu fait plus de 700 px ca va dépasser nan


---------------
Mon topic Tiësto
n°1561787
dartyduck
n00b AttitudE
Posté le 17-05-2007 à 22:17:55  profilanswer
 

700 sté un exemple. si son contenu ne bougera pas, qu'il le fixe aux limites du contenu, stoo :o


---------------
Nikon D7000 + 18-105VR + 35mm 1.8
n°1562067
zupstyle
Posté le 18-05-2007 à 14:48:53  profilanswer
 

toutes  les pages non pas la meme hauteur, je comprends pas bien ce que tu veux me conseiller, dsl :/


---------------
Mon topic Tiësto

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  bloc div flottante droite qui ne prends pas toute la hauteur

 

Sujets relatifs
Barre de defilement, et centrage de bloc sur la pageBalise div de 100% de la hauteur sous IE
Hauteur des cellules en fonction de leurs valeurs?div de la hauteur de l'écran
Contenu prenant toute la hauteur[CSS] problème de bloc - ajout d'images
[CSS] Largeur mini de page pour positionner barre verticale à droitehauteur en % dans les DIV
AutoSize en hauteurTableau avec ombre en bas et à droite
Plus de sujets relatifs à : bloc div flottante droite qui ne prends pas toute la hauteur

Forum MesDiscussions.Net, Version 2010.2
(c) 2000-2011 Doctissimo
Page générée en 0.058 secondes

Copyright © 1997-2025 Groupe LDLC (Signaler un contenu illicite / Données personnelles)