Forum : forcer un div a rester en bottom même en redimensionnant la fenetre

Bonjour,

je voudrais que mon div "panneau" reste en bottom meme en redimentionnant la fenetre

voici mon code de base

<!doctype html5)
<html>
<head>

    <title>patricktoulon player html5 </title>
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE11" >
 <style>
*{margin:0;}   

#conteneur{
    background-color:rgb(0,0,255);
    width:100%;
    height:100%;
}

#ecran{
width:100%;
height:100%
}
#panneau{
    width:99%;
    height :50px;
    top:150px;
    margin-bottom:0;
    position:absolute;
    border:2px solid green;
}
#controPanel{
    width:100%;
    height :100%;
    margin-bottom:50px;
    background-color:rgba(255,0,0,0.5);
}

</style>

<script type="text/javascript">

</script>

</head>

<Body>
<div id "conteneur" width=400 height=250  >

 <video  id="ecran" src="G:\movie.mp4"></video>

                 <div id ="panneau"  >

                      <div id ="controlPanel" >

                      </div>
                 </div>
</div>

</Body>
</html>

2 réponses

Lartak

Bonsoir.
As-tu tout simplement pensé à fixed: bottom; ?

Alainpre

Le bloc "panneau" est en position absolute. A partir de là, il sepositionne en fonction des propriétés left, top, bottom ou right.
Dans ton cas je pense qu'il suffit de lui ajouter la propriété bottom:0 la propriété margin-bottom permet d'ajuster l'espace entre le div et le bas de l'éccran.

Pour plus d'explications, jette un oeil sur la propriété position