/ Code Css bottom | Résultat du code Css bottom | Copie d'écran / J'ai vu une erreur dans cette page

Exemple de code de la propriété CSS bottom.

<style>
.exemple-position {
  : absolute; 
  : 0px; 
 border:1px dotted #666; 
}
.exemple-position-bottom-1{  : 10px; height : 30px; }
.exemple-position-bottom-2{  : auto; top : auto; height : 30px; }
.exemple-position-bottom-3{  : auto; top : auto; height : auto; }
.exemple-position-bottom-4{  : 0; top : 0; height : auto; }
.exemple-position-bottom-5{  : 0; top : 0; height : 30px; }

.exemple-origine{  : relative; width:500px; height:100px; margin-top:10px; border:1px solid #666; }
</style>

<div class="exemple-origine">
 <div class="exemple-position exemple-position-bottom-1">bottom-1) bottom:10px; height : 30px; </div>
</div>
<div class="exemple-origine">
 <div class="exemple-position exemple-position-bottom-2">bottom-2) bottom : auto; top : auto; height : 30px; </div>
</div>
<div class="exemple-origine">
 <span class="exemple-position exemple-position-bottom-3">bottom-3) bottom : auto; top : auto; height : auto; </span>
</div>
<div class="exemple-origine">
 <span class="exemple-position exemple-position-bottom-4">bottom-4) bottom : 0; top : 0; height : auto; </span>
</div>
<div class="exemple-origine">
 <span class="exemple-position exemple-position-bottom-5">bottom-5) bottom : 0; top : 0; height : 30px; </span>
</div>

Interprétation du code de la propriété bottom CSS par votre navigateur.

bottom-1) bottom:10px; height : 30px;
bottom-2) bottom : auto; top : auto; height : 30px;
bottom-3) bottom : auto; top : auto; height : auto;
bottom-4) bottom : 0; top : 0; height : auto;
bottom-5) bottom : 0; top : 0; height : 30px;

Interprétation normale du code de la propriété CSS bottom (copie d'écran).

copie d'écran de l'affichage de la propriété CSS bottom