Make table wrap like in preview mode

,
#1

Hello, looking for some support. I have a standard wikitext table which overflows to the right:

In view
In view1545×1776 29.4 KB

However, in Wikitext preview mode, I see a narrower version of the very same table, which does wrap.

In preview
In preview1780×1842 47.2 KB

I believe it is because the leftmost column uses backticks, meaning some text is enclosed in <code> elements. This text does not wrap in View, but does wrap in Preview.

I have not been able to replicate the wrapped table shown in Preview with any of the CSS utility classes offered in the documentation.


I’d be grateful for assistance getting this table to wrap, as I’m happy with the high degree of wrapping shown in the preview version of the tiddler.

Note: I use a few lines of CSS from CenterStory which is why my tiddler is quite narrow, but I can confirm this happens without those customisations also.

1 Like
#2

Have you tried using the browser inspect to try and identify the CSS differences between the two cases?

1 Like
#3

There wasn’t a specific class for it but inspired by your comment, I went further up the cascade.

It inherits two particular properties from the preview classes:
overflow-wrap: anywhere; and word-break: normal;

… is the best solution here just to make a custom class? :thinking:

#4

Yes. I would advise you do the same. @TW_Tones beat me to it.