J'ai eu quelques problèmes de réactivité dans quelques articles, sur mon blog. Il s'est avéré que c'était des extraits de code
J'ai eu quelques problèmes de réactivité dans quelques articles, sur mon blog.
Il s'avère que ces messages sur lesquels j'ai eu des problèmes, ils avaient tous un extrait de code qui dépassait la largeur de page normale sans espace.
Par exemple
cd /some/super/long/super/long/folder
ou toute autre commande très longue.
Les extraits de code sur mon blog sont tous automatiquement ajoutés à l'intérieur d'uncode
étiquette, et à l'intérieur dans unpre
étiqueter.
Par défaut le CSSwhite-space
propriété sur lepre
la balise est définie surnormal
, et pour résoudre ce problème, nous le définissons surpre-wrap
:
pre {
white-space: pre-wrap;
}
Lorsque certains mots sont trop longs, ils peuvent encore casser la mise en page. Pour résoudre ce problème, ajoutez également:
pre {
word-break: break-all;
}
Téléchargez mon gratuitManuel CSS
Plus de didacticiels CSS:
- Le guide Flexbox
- Tutoriel CSS Grid
- Variables CSS (propriétés personnalisées)
- Introduction à PostCSS
- La propriété CSS margin
- Comment centrer un élément avec CSS
- Polices système CSS
- Comment imprimer votre HTML avec style
- Un guide d'introduction aux transitions CSS
- Un didacticiel sur les animations CSS
- Introduction au CSS
- Le guide CSS
- Comment configurer Tailwind avec PurgeCSS et PostCSS
- La feuille de triche de Tailwind
- Comment faire pivoter en continu une image en utilisant CSS
- Rendre un tableau réactif en utilisant CSS
- Comment déboguer CSS en divisant en deux
- Sélecteurs CSS
- Cascade CSS
- Spécificité CSS
- Sélecteurs d'attributs CSS
- Couleurs CSS
- Unités CSS
- URL CSS ()
- Typographie CSS
- Le modèle CSS Box
- La propriété de position CSS
- Requêtes multimédias CSS et conception réactive
- Requêtes de fonctionnalités CSS
- Transformations CSS
- Comment styliser des listes en utilisant CSS
- Préfixes de fournisseur CSS
- Héritage CSS
- Pseudo-classes CSS
- Pseudo éléments CSS
- Styliser les tableaux HTML avec CSS
- La propriété d'affichage CSS
- La fonction CSS calc ()
- Bordures CSS
- Importer un fichier CSS avec @import
- Gestion des erreurs CSS
- Filtres CSS
- Dimensionnement de la boîte CSS
- Arrière-plans CSS
- Commentaires CSS
- Polices CSS
- Remplissage CSS
- La propriété CSS float et la compensation
- Normalisation CSS
- La propriété CSS z-index
- Comment désactiver la sélection de texte à l'aide de CSS
- Comment mettre un élément au bas de son conteneur en utilisant CSS
- Comment inverser les couleurs en utilisant CSS
- Balises pré réactives en CSS
- Intégrations de vidéos YouTube réactives
- Quelles sont les bonnes valeurs CSS Breakpoint pour le Responsive Design?
- Comment aligner le centre dans Flexbox