Envelopper et tronquer le texte
Chantier
Cette page est en chantier.
Veuillez transmettre un problème ou soumettre une demande de tirage s'il manque des renseignements ou des codes ou si la synchronisation est incorrecte ou déphasée avec le principal référentiel (wet-boew/wet-boew).
Usage
Les utiliser pour empêcher que du texte retourne à la ligne suivante.
Conception et codage
Utilisation de base
Défaut
S'en servir pour contrôler où et comment les mots retournent automatiquement à la ligne suivante à l'intérieur d'une ligne de texte.
Apparence
Défaut :
Lorem ipsum dolor sit amet, consectetur 30 avril.
Avec .nowrap
:
Lorem ipsum dolor sit amet, consectetur 30 avril.
Bonne utilisation
Points de conformité :
- L'utiliser pour empêcher que des éléments de contenu comme le numéro de téléphone, le code postal, une équation mathématique, une date et la ponctuation française (le deux-points, les crochets et les autres éléments qui nécessitent des espaces) retournent automatiquement à la ligne suivante sur plusieurs lignes
- Rappelez-vous que la page est réactive à la largeur du navigateur
- Le texte retourne automatiquement à la ligne suivante à des points différents sur des appareils et des espaces de visionnement différents
- Ajoutez
.nowrap
pour convenir aux résolutions différentes
Mauvaise utilisation
Points de conformité :
- N'utilisez pas cet élément d'une façon qui entre en conflit avec les points de conformité précédents
- Ne l'utilisez pas pour renvoyer automatiquement des phrases complètes à la ligne suivante
- Ne l'utilisez pas pour l'information non textuelle
Code
<p>... <span class="nowrap">30 avril</span>.</p>
Utilisation améliorée
Tronqué
Utiliser pour tronquer le texte pour qu'il s'insère dans une colonne de grille sur une seule ligne. Tout texte au-delà de la bordure de la grille sera recadré et remplacé par un trois points. Le texte disparaît seulement visuellement, il peut cependant toujours être lu par les lecteurs d'écran.
Apparence
Défaut :
Lorem ipsum dolor sit amet, consectetur 30 avril.
Avec .wb-elps
:
Lorem ipsum dolor sit amet, consectetur 30 avril.
Bonne utilisation
Point de conformité :
- Utilisez principalement avec des hyperliens pour prévenir un retour automatique à la ligne (si la hauteur est une préoccupation et que
.wb-eqht
ne peut être appliqué) ou s'il affiche en dehors des colonnes d'une grille (quand.nowrap
est appliqué)
Mauvaise utilisation
Points de conformité :
- Ne pas utiliser ce style pour des phrases, car il peut cacher des informations à un utilisateur visuel
- Ne pas utiliser à la place de
.wb-eqht
lorsque vous tentez d'obtenir une hauteur égale sur une rangée de grille - N'utilisez pas cet élément d'une façon qui entre en conflit avec le point de conformité précédent
Code
<p class="wb-elps">...</p>