4 ms·
Good stuff. Once note though, line wrapping on mobile is very awkward for me. The pre-wrapped lines are longer than fit in my viewport, so I end up with all t
by montroser 5y ago
Good stuff.
Once note though, line wrapping on mobile is very awkward for me. The pre-wrapped lines are longer than fit in my viewport, so I end up with all these left over stubs each spilling onto a short subsequent every-other line.
This actually seems like a hard problem to solve? If you just don't pre-wrap lines, then mobile is better, but desktop may end up showing way too many characters per line. But at least the user is on control then, and they can resize their window however they like. Wikipedia has no max-width set, and people deal with it well enough...
Is there any other non-HTML/CSS option?
- Curiositry 5y agoThank you montroser. This is something that really bugged me, when I (belatedly) tested it on mobile. I had to chose between optimizing for mobile, and optimizing for desktop, and I chose the latter. To have a good experience on mobile, you have to use landscape mode, or reduce your font size. Since it is still readable on mobile, I figured that the people who were interested in the content would know how to — and take the time to — rotate their phone so the images such would display properly. I switched to shorter hard wrapping, so that phones with wide screens would look OK. But I found that a standard smartphone has so little horizontal screen space that no matter how short I wrapped it, it would overflow (and look just ridiculous on desktop). Also, I couldn't wrap it as much as I wanted to, because of the image I had chosen, which is fixed width. Admittedly, wrapping on mobile — and fixed-width images in specific — is one biggest issues with this "idea" :)
- eigengrau5150 5y agoI used the reader mode that Firefox provides on Android. It solved most of the issues but mangled the ascii art. Oh, well. I suppose that if OP cared, they could write a tiny shell script to wrap blog.txt inside HTML <pre> with some inline CSS to provide word-wrapping.