tête css fixe et flottant contenu

voici mon css:tête css fixe et flottant contenu

html { 
 
    height: 100%; 
 
} 
 
body { 
 
    height: 100%; 
 
    width: 300px; 
 
    margin: 0px; 
 
} 
 
div.div1 { 
 
    height: 100px; 
 
    background-color: red; 
 
} 
 
div.div2 { 
 
    background-color: blue; 
 
    height: 100%; 
 
}

<div class="div1"></div> 
 
<div class="div2"></div>

le problème est que je veux corps à flotter-base, mais sans faire défiler à l'intérieur. Le doctype est sctrict. Navigateur: ff3. C'est possible?

Source

2009-10-21 gasan

Vous pouvez ajouter un div supplémentaire dans div2 pour afficher le contenu. en fait que div aura une marge supérieure de 100px pour éviter le chevauchement supérieur div sur votre contenu. div2 s'étend de haut en bas mais le top 100px ne sera pas utilisé par div contenu. Donc, astuce est de garder la même taille de div1 avec marge supérieure du contenu. il sera bien

html:

<body> 
<div class="div1">div1 div1 div1 div1</div> 
<div class="div2"> 
    <div class="content"> 
    <div2 test <br/> 
    <div2 test <br/> 
    <div2 test <br/> 
    <div2 test <br/> 
    </div> 
</div> 
</body>

et css sera quelque chose comme:

html,body {height:100%;width:300px;margin:0px;} 
div.div1 {height:100px; background-color:red; position:absolute; width:300px;} 
div.div2 {background-color:blue; height:100%;} 
div.content {margin-top:100px; float:left; width:100%;}

si vous voulez cacher complètement défiler juste ajouter overflow:hidden-div.div2

aussi vous pouvez donner la même couleur d'arrière-plan au conteneur pour que div2 ait l'air transparent (il ne s'étendra pas après le défilement.)

div.content {margin-top:100px; float:left; width:100%; background:blue;}

acclamations

Source

2010-01-27 11:36:21 eringen

tête css fixe et flottant contenu

Répondre

Questions connexes