[CSS] - Problème avec la hauteur

Résolu
Bonjour,

J'ai pris le temps de prendre des screenshots, afin de vous faire mieux comprendre mon problème.
Donc voila, j'ai un problème avec la hauteur d'une div, elle ne veut pas s'ajuster.
Je voudrais qu'elle prenne toute la largeur de la page (car le cors derrière en blanc varie selon le nombre de commentaire présent sur la page, donc la hauteur n'est pas fixe, sinon ça serait trop facile !).

Voir les images ci-dessous :

http://img15.hostingpics.net/pics/473812952.png
http://img15.hostingpics.net/pics/681980381.png

Voici le code source de la parti de gauche
#corp .left { 
 float: left; 
 width: 170px; 
 height:380px; 
 word-wrap: break-word; 
 border-right: solid 1px #999; 
 padding-right:10px; 
 padding-left:10px; 
 padding-top:10px; 
 padding-bottom:10px; 
 margin-right:20px; 
 background:#EEE; 
}


J'ai essayé les height:100% ou autre, ça ne donne rien !

Merci d'avance !

--
░░░░▒▒▒▒████ ♠ MastercroW ♠ ████▒▒▒▒░░░░

13 réponses

  1. il faudrait plus d'info,

    fais un imprim ecran de ta page complete, et comment tu veux placer les différents éléments

    le css de body du div principal de la partie gauche et de la partie droite
    1. Bonjour à tout le monde merci de m'avoir répondu.

      Ceci j'ai déjà essayer et ça ne marche pas.
      Avez vous d'autres solutions ?
      1. Oui c'est min-height appliqué sur ta DIV qui va avoir le bon rendu.

        A+
        1. et avec un min-height :100% ?
          ------------------------------------------------------------------------------------------
          Lien supprimé Modération CCM
          1. Modérateur
            stpl : pas de lien en signature ;)
          2. Modérateur
            Bonjour,

            @ aurésky

            à lire >>> https://www.commentcamarche.net/faq/32622-signature-sur-les-forums-ccm

            Cordialement
          3. Oups, je rectifie çà de suite !
        2. J'ai trouvé ceci en JS :
          <script language="javascript">
          function look()
          {
          	var doc = document.getElementById('corp');
          		
          		if (document.all) // ok I.E
          		{
          		H = doc.currentStyle.height;
          		}
          		
          		else // ok firefox.0.9.2 , pas mozilla.1.0 ni netscape.7.02
          		{
          			H = document.defaultView.getComputedStyle(doc, null).height;
          		}
          		
          		alert(''+ H + ' ');
          }
          </script>
          


          Sauf que avec le min-height ça me dit 400 px, sa s'adapte pas.
          Avez-vous une solution ?
          1. Bonjour,

            Merci d'avoir prit le temps de me répondre.

            Le code source de mon corps c'est :
            #corp {
            	width: 70%;
            	/*height:100%;*/
            	min-height: 400px;
            	min-width: 960px;
            
            	-webkit-border-radius: 5px;
            	-moz-border-radius: 5px;
            	border-radius: 5px;
            	-webkit-box-shadow: 0 0 15px #CCC;
            	-moz-box-shadow: 0 0 15px #ccc;
            	border-style: solid;
            	border-color: white;
            	border-width: 1px;
            	background-color: #F9F9F9;
            	padding:15px 15px 15px 15px;
            	box-shadow: 0 0 15px #CCC;
            	word-wrap: break-word;
            	/*margin-top:60px;*/
            	margin-right: auto;
            	margin-left:auto;
            }


            Quand à aladin07, j'essai ça de suite !
            1. Je crois que c'est faisable mais avec du javascript (jQuery):

              // pad est la valeur du padding-top ou padding-bottom que tu as donné à #corp
              // ne calcule pas les deux padding: si #corp a padding:10px; ne mets pas 20px
              // dans pad
              var pad = 10;
              var height = $('#corp').height();
              $('#corp .left').height(height - pad*2);
              1. le site est en ligne qu'on aille jeter un coup d'oeil sur le reste du code ?
                1. Non désolé ! Tu voudrais quel code ?