Réglez la hauteur div égale à la taille de l'écran

J'ai un div élément de twitter bootstrap qui ont un contenu qui fera déborder verticalement à l'extérieur de l'écran.

Je voudrais la div pour prendre la hauteur de la taille de la fenêtre du navigateur et de laisser le reste du contenu de défilement verticale à l'intérieur de la fenêtre.

J'ai un exemple qui ne fonctionne pas @jsFiddle

#content {
    border: 1px solid #000;
    overflow-y:auto;
    height:100%;
}

<div class="container-fluid">
    <div class="row-fluid">
        <div class="span3">Side Bar</div>

        <div class="span9" id="content">
            Content Bar Example Content
        </div>
    </div>
</div>

Je suis l'affichage de cette question après la lecture des questions comme AINSI en question

EDIT--

Désolé les gars je suppose que j'ai eu ma question mal.

Ce que je voudrais, c'est que mon div doit remplir le reste de l'espace vertical de l'écran.

Ce serait génial si quelqu'un peut proposer une solution réactive

source d'informationauteur Anand Sunderraman

  1. 23

    Vous avez besoin de donner height pour le parent de l'élément de trop! Découvrez ce violon: http://jsfiddle.net/ntLpg/17/

    CSS:

    html, body {height: 100%;}

#content, .container-fluid, .span9
{
    border: 1px solid #000;
    overflow-y:auto;
    height:100%;
}​

    Façon JavaScript:

    $(document).ready(function(){
    $(window).resize(function(){
        $(".fullheight").height($(document).height());
    });
});
  2. 21

    À l'aide de CSS {height: 100%;} correspond à la hauteur de la mère. Ce pourrait être n'importe quoi, sens plus petite ou plus grande que l'écran. À l'aide de {height: 100vh;} correspond à la hauteur de la fenêtre d'affichage.

    .container {
    height: 100vh;
    overflow: auto;
}

    Selon Mozilla documents officiels, 1vh est:

    Égale à 1% de la hauteur de la fenêtre initiale du bloc contenant.

  3. 12

    essayer cette 

    $(document).ready(function(){
    $('#content').height($(window).height());
});
  4. 1

    utilisation 

     $(document).hauteur()

    de la propriété et de l'ensemble de la div à partir d'un script et de définir 

     débordement=auto

    pour le défilement