Bonjour je débute un peu en html/ css et j'ai beau regarder Google impossible de solutionner mon problème.

pour faire simple j'ai un section de classe slideshow contenu dans un section lui même contenu dans un div lui même contenu das un div de class container.
J'ai mis height : 100% pour chaque conteneur parent mais des que je rentre une valeur de hauteur pour mon slideshow(ex 300px), mon container noccupe plus 100% de son conteneur parent, ici body et donc le pied de page se retrouve vers le milieu de la page et non plus en bas...

Voila si je me suis mal exprimé ou si mon code n'est pas bon quelque part merci de me le dire!

Cordialement

code Html du body:

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
<body>
<div class="container">
      <header class="row tête">               /*en-tête de page : occupe les 12 colonnes de bootstrap et possède une taille définie en px*/
            <div class="col-lg-3 logo">
            </div>
            <div class="col-lg-6 blocRecherche">
                <div class="row barreDeRecherche">
                    <div class="col-lg-10">
                        <input type="search" class="input-sm form-control recherche" placeholder="Recherche par mots-clefs"/>
                    </div>
                    <div class="col-lg-2">
                        <button type="submit" class="btn btn-primary btn-sm validation"><span class="glyphicon glyphicon-search"></span> Chercher</button>
                    </div>
                </div>
            </div>
            <div class="col-lg-3 panier">
            </div>                                 
        </header>
    <div class="row contenu">                            /*corps de page  comprenant une barre de navigation à gauche, un section au milieu et un aside sur la droite*/
        <nav class="col-lg-2 navbar navigation">
            nav text
        </nav>
        <section class="col-lg-8 body-content">
            <section id="slideshow">
                  <div class="contenuSlide">
                          <div class="c_slider"></div>
                          <div class="slider">
                                       <figure>
                                            <img src="~/Content/img/dummy-640x310-1.jpg" alt="" width="640" height="310" />
                                            <figcaption>The mirror of soul</figcaption>
                                       </figure>
 
                                       <figure>
                                            <img src="~/Content/img/dummy-640x310-2.jpg" alt="" width="640" height="310" />
                                            <figcaption>Let's cross that bridge when we come to it</figcaption>
                                       </figure>
 
                                       <figure>
                                           <img src="~/Content/img/dummy-640x310-3.jpg" alt="" width="640" height="310" />
                                           <figcaption>Sushi<em>(do)</em> time</figcaption>
                                        </figure>
 
                                       <figure>
                                             <img src="~/Content/img/dummy-640x310-4.jpg" alt="" width="640" height="310" />
                                             <figcaption>Waking Life</figcaption>
                                       </figure>
                              </div>
                         </div>
                  <span id="timeline"></span>
             </section>
        </section>
        <aside class="col-lg-2">
        </aside>
    </div>                                                  /*footer */
    <footer row class="col-lg-12 pied">
        pied de page
    </footer>
    </div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
</body>


Code CSS :

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
html {
    height: 100%;
}
body {
    min-height: 100%;
}
.container {
    margin: 0;
    padding: 0;
    height: 100%;
    max-width: none;
}
.contenu {
    height: 100%;
}
.body-content {
    height: 100%;
}
.pied {
    position: relative;
    bottom: 0;
    height: 100px;
    background-color: red;
}
.tête {
    margin: 0;
    height: 150px;
    background: url(img/bibliotheque2.jpg) no-repeat center;
    background-size: cover;
}
.logo,.panier,.blocRecherche {
    height: 100%;
}
.barreDeRecherche {
    position: absolute;
    bottom: 10px;
    width: 100%;
}
.contenu {
    background-color: rgba(200, 173, 127,0.8)
}
#slideshow {
	position: relative;
	width: 672px;
	height: 342px;                                   /*ca merde ici des que je donne une taille en pixel à height*/
	padding: 15px;
	margin: 0 auto 2em;
	border: 1px solid #ddd;
	background: #FFF;
	/*CSS3 effects*/ 
	background: linear-gradient(#FFF, #FFF 20%, #EEE 80%, #DDD);
	border-radius: 2px 2px 2px 2px;
	box-shadow: 0 0 3px rgba(0,0,0, 0.2);
    overflow: hidden;
}