it-swarm.com.de

CSS: Wie bekomme ich Bildlaufleisten für div in Containern mit fester Höhe?

Ich habe folgenden Aufschlag:

<div class="FixedHeightContainer">
  <h2>Title</h2>
  <div class="Content">
    ..blah blah blah...
  </div>
</div>

Das CSS sieht so aus:

.FixedHeightContainer
{
  float:right;
  height: 250px;
  width:250px;  
}
.Content
{
  ???
}

Aufgrund des Inhalts ist die Höhe von div.Content Normalerweise größer als der von div.FixedHeightContainer Bereitgestellte Platz. Im Moment ragt div.Content Fröhlich aus dem Grund von div.FixedHeightContainer Heraus - überhaupt nicht, was ich will.

Wie gebe ich an, dass div.Content Bildlaufleisten erhält (vorzugsweise nur vertikal, aber ich bin nicht pingelig), wenn die Höhe zu groß ist, um zu passen?

overflow:auto Und overflow:scroll Tun aus irgendeinem bizarren Grund nichts.

79
David

das Einstellen von overflow sollte sich darum kümmern, aber Sie müssen auch die Höhe von Content einstellen. Wenn das Attribut height nicht festgelegt ist, wird das div vertikal so hoch wie nötig, und Bildlaufleisten werden nicht benötigt.

Siehe Beispiel: http://jsfiddle.net/ftkbL/1/

135
Dutchie432

Code aus der obigen Antwort von Dutchie432

.FixedHeightContainer {
    float:right;
    height: 250px;
    width:250px; 
    padding:3px; 
    background:#f00;
}

.Content {
    height:224px;
    overflow:auto;
    background:#fff;
}

verwenden Sie die Eigenschaft overflow

overflow: hidden; 

overflow: auto;

overflow: scroll;

es wird inshaAllah funktionieren :)

0
bisma