I added "min-width: 500px" to the code from https://tiddlywiki.com/#Hard%20Linebreaks%20with%20CSS ... and it temporarily fixed it on my 3 column Muuri Storyview (desktop computer monitor) ... when I added a fourth column it began to overlap the poetry tiddler column, covering up the poem. ... when I added a fifth column, it switched and the poem stayed on top of everything else (but with a grey overlay over half of it) no matter how many columns I added.
On Monday, March 15, 2021 at 4:25:46 PM UTC+8 Sapphireslinger wrote: > > I found https://tiddlywiki.com/#Hard%20Linebreaks%20with%20CSS which > takes care of the linebreaks, so I don't have to type <br> after each line > of poetry. > > But when the tiddler width shrinks, either because I'm using Muuri > Storyview, or viewing it on my smartphone, the poem lines still wrap. I > just want the text to shrink so it doesn't have to wrap and mess up the > structure of the poem. > > I found "Just Use SVG" (the last option at the bottom of the page) at > https://css-tricks.com/fitting-text-to-a-container/ But I don't know how > to implement it. > > On Friday, March 12, 2021 at 1:14:06 PM UTC+8 Sapphireslinger wrote: > >> How do I get a modal or detail widget to automatically detect the >> container size and automatically shrink or enlarge the text so that poem >> lines don't wrap or go out of the container? >> >> I click on a modal with a poem in it on my desktop, no problem: >> >> Line 1 - XXXXXXXXXXXX >> Line 2 - XXXXXXXXXXXXXXXX >> >> I click on the same modal on my mobile. The modal container shrinks to >> fit the size of the new screen but the text doesn't! The poem lines are all >> wrapped (instead of the font shrinking to keep line from wrapping): >> >> Line 1 - XXXXXXXX >> XXXX >> Line 2 - XXXXXXXX >> XXXXXXXX >> >> This is not good for poetry where part of the art is the line breaks. >> >> Is there a "no-wrap, shrink or enlarge font-size instead, looking at >> parent div" command? >> > -- You received this message because you are subscribed to the Google Groups "TiddlyWiki" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/tiddlywiki/614ac8cd-6aeb-46b0-8ab0-75c9f3628295n%40googlegroups.com.

