Join the AI Workshop and learn to build real-world apps with AI. A hands-on, practical program to level up your skills.
I’ve had some problems with responsiveness in a few posts, on my blog.
It turned out that those posts all had a code snippet that extended beyond the normal page width without a space.
For example:
cd /some/super/long/super/long/folder
or any other very long command.
Code snippets on my blog are automatically wrapped in a code tag, which is placed inside a pre tag.
By default the CSS white-space property on the pre tag is set to normal, and to fix this problem we set it to pre-wrap:
pre {
white-space: pre-wrap;
}
When some words are too long, they can still break the layout. To fix this, also add:
pre {
word-break: break-all;
}