Compute shrink-to-fit width for tables

[AmaiKinono]

Close #671.

I'm mostly referencing #559 and the TableFormattingContext::Format implementation. Maybe there are some unnecessary calculations as I'm still not very familiar with the codebase (and C++).

In my test, the example in #671 displays correctly in a flexbox:

[mikke89]

Hey, and thanks a lot for contributing!

I wonder if this actually works as intended in typical scenarios, does the table actually shrink down to its contents? Because our tables don't really adapt to their content, so I suspect that the table size just becomes the available space you give it. You could quickly test this with a table with e.g. float: left applied, or inside an auto-sized inline-block. Also, an inline-table should by default shrink to its width as well, if that works as intended. Testing in a flex container is not sufficient, because they apply their own sizing rules.

I think we definitely need a lot more test cases to better understand the results here.

I suspect that there isn't really a way outside of formatting the contents of each cell, and figuring out the narrowest table size based on that. Sounds super slow though and I'm quite worried about performance impacts here, I'm not sure if it's something that's really worth it considering that.

[AmaiKinono]

Seems you are right. I put the table in an inline-block and it still expands when I enlarge the window.

Because our tables don't really adapt to their content

So if understand it correctly, I could set the column widths manually (is it doable?), and make it work in a flexbox? I will try that later.

Sounds super slow though and I'm quite worried about performance impacts here, I'm not sure if it's something that's really worth it considering that.

Thanks, and I now understand it's difficult to have the content determine the table's size. It's still a bit against my web developing experience, where an element's size is determined by both its content and external constraints, but I think I'm slightly get into the mindset of doing layout in RmlUi.

[AmaiKinono]

I could set the column widths manually (is it doable?), and make it work in a flexbox?

I've tried and this actually is not working. A table with column widths specified:

<table style="">
    <col style="width: 8em;"/>
    <col style="width: 12em;"/>
    ...
</table>

Shows like this:

Its left bound is centered, so seems the flexbox still thinks the table has zero width. If we specify the width of the table:

<table style="width: 20em; ">
    <col style="width: 8em;"/>
    <col style="width: 12em;"/>
    ...
</table>

It shows correctly:

I think determine shrink-to-fit width of tables using the spcified widths of the columns is doable, as column widths can be determined rather intuitively during design, and the approach seems to not have a performance impact.

[mikke89]

So if understand it correctly, I could set the column widths manually (is it doable?), and make it work in a flexbox? I will try that later.

The current implementation of shrink-to-fit width simply returns "0" for tables, so I wouldn't expect this to work. Setting a width for the table itself should work, since then it doesn't really on shrink-to-fit at all, it just uses the specified width.

I think determine shrink-to-fit width of tables using the spcified widths of the columns is doable, as column widths can be determined rather intuitively during design, and the approach seems to not have a performance impact.

Yeah, that should be perfectly alright from a performance stand-point. I wonder how common this situation is though, it seems like a very specific case to me, so I'm not sure if it's actually worth the trouble? It could even be a bit surprising behavior, say you e.g. add a new column that you don't specify a width for, and you get a completely different behavior.

[AmaiKinono]

I wonder how common this situation is though, it seems like a very specific case to me, so I'm not sure if it's actually worth the trouble?

I'm not sure too. I'm just trying to figure out how to use rcss tables as an alternative to css grids. And from a visual design point, I think it's easier to estimate the widths of columns than of the whole table.

Anyway, I think I should close this for now as the implementation doesn't achieve its goal.