Sommaire

Masquer des éléments CSS POUR LA MISE EN PAGE:Masquer des éléments

Bootstrap permet de masquer des éléments à l’affichage de la page. Mais ces éléments, non visibles pour l’internaute, le seront pour le navigateur. Pour ce faire, il suffit d’utiliser la classe .sr-only dans l’élément HTML à ne pas afficher.

Voici le code HTML pour ne pas afficher une boîte <div> :

<div id="boite2" class="sr-only"> 
   ... 
</div>

Naturellement nous ne pouvons pas vous montrer le résultat dans une copie d’écran, puisque ce lien n’est pas visible !

Voici la classe .sr-only utilisée :

.sr-only { 
   position: absolute; 
   width: 1px; 
   height: 1px; 
   padding: 0; 
   margin: -1px; 
   overflow: hidden; 
   clip: rect(0 0 0 0); 
   border: 0; 
}

Utilisez le fichier Bootstrap-02-CSS/06-mep-3.html pour afficher cet exemple.