Word wrapping in HTML Tables

General out-of-character discussion among players of Cantr II.

Moderators: Public Relations Department, Players Department

User avatar
Wasindear
GAB Member/ProgD Chair/GM Member
Posts: 35
Joined: Tue Oct 20, 2020 11:24 am

Word wrapping in HTML Tables

Postby Wasindear » Tue Oct 20, 2020 11:55 am

So my character and their friend have started making a game using the dice they found. I have been writing down the rules they have been making up and the time has come for them to write them down in character. However I am having a real difficulty in getting the html table to word wrap automatically. Could anyone with more experience with Cantr html peculiarities offer some advice please?

Here is the current code I've been trying:

<table style="width: 310px;word-wrap:break-all;table-layout: fixed;">
<tbody>
<tr>
<td style="width: 90px; text-align: center;">Example text that is long enough to overflow</td>
<td style="width: 220px; text-align: center;">Why won't you wrap? I've done everything I can think of! OH GOD JUST WRAP! T_T </td>
</tr>
</tbody>
</table>

and here is the style tag:

<style type="text/css">
table,th,td {
border:1px solid black;
border-collapse:collapse;
word-wrap:break-all;
}
th,td {
padding:2px;
text-align:middle
}
</style>

And results in this:

Image

Which is also interesting because it highlights the text is wrapping just not in anyway that makes sense to me!!

Any help, advice, or even commiseration at this point, would be greatly appreciated :D
User avatar
Wasindear
GAB Member/ProgD Chair/GM Member
Posts: 35
Joined: Tue Oct 20, 2020 11:24 am

Re: Word wrapping in HTML Tables

Postby Wasindear » Tue Oct 20, 2020 12:03 pm

I have found the solution

table,th,td {
border:1px solid black;
border-collapse:collapse;
word-wrap:break-all;
white-space:normal
}

Image

leaving this thread though for future generations :P
User avatar
alecto
Posts: 73
Joined: Tue Feb 04, 2020 10:07 am

Re: Word wrapping in HTML Tables

Postby alecto » Tue Oct 20, 2020 1:06 pm

Oh thank the stars it's not just me, lol

...Although I seem to be having the opposite problem, where tables and lists are wrapping where I don't want them to, argh.

I've found this works, mostly:
white-space:nowrap

Return to “General Discussion”

Who is online

Users browsing this forum: No registered users and 1 guest