Table column sizes jump around while typing text

[Dan Dascalescu]

This is a rather obvious bug. I must've searched for the wrong keywords.

Or maybe it's a feature?

Just insert a 3x3 table at ​http://ckeditor.com/demo#full and start typing. The column sizes will jump all over the place.

[Piotrek Koszuliński]

This isn't a bug. This is how automatic table layout mechanism works in HTML. A table which is added by the table plugin does not have columns widths set. This means that they will be adjusted to the content that's inserted. If you want constant columns widths you would need to use the tableresize plugin to adjust columns widths or e.g. you can use stylesheets.

[Dan Dascalescu]

While this may not technically be a bug, it certainly isn't what users expect either.

The behavior in CKEditor violates the ​principle of least astonishment.

[Piotrek Koszuliński]

I totally understand your point about least astonishment and if there was some reasonable solution (also in terms of complexity), then we would consider implementing it. But I'm afraid there isn't.

You mentioned the principle of least astonishment. We should apply this principle not only to what happens inside the editor, but also what happens outside it. The content that is produced by CKEditor is later displayed on websites and in other places. It should render in similar way in both places. I'm not saying "identical", because editors like CKEditor should be more focused on semantical value, not presentational.

You mentioned two editors in which tables seem to work right. First of all, Google Docs have nothing to do with HTML, so we can forget about it. This editor is supposed to be a MSWord replacement, so it serves a different purpose. Then you mentioned Textbox.io and I was curious what they could do, so I checked.

First, a table with width:100% and cells with widths 100%/N (where N == number of cells) is inserted. That of course seems to solve the issue with columns dynamically changing widths. But I know what problems it can cause, so I checked further. I resized a column. Surprise, surprise, percentage values are replaced with absolute values. Inside editor it still looks fine, but try to render that content somewhere else and you'll be disappointed. Inside the editor table seems to take 100% width, but it's only a mirage. On a target page this table will have exactly the same width, while the rest of the content may be wider or narrower. What's more – a developer cannot do anything with that table, because inline styles are used by Textbox.io. In other words – developers and users will be surprised by the end result.

Don't misunderstand me – I'm not saying that CKEditor works perfectly in this case. It uses inline styles for the entire table too and if you use the tableresize plugin it will use inline styles with absolute values too. It's not good. But it's just the default behaviour, when CKEditor isn't configured.

So what you can do with CKEditor? You can change the table dialog to not use inline styles and you can disable the tableresize plugin to gain a full control from the stylesheets. This allows you to make responsive tables that will render correctly in every place. You can use styles dropdown to apply classes to tables or cells. This allows the developer to predefine what layouts the user can later choose. And using CKEditor's rich API you can achieve many other results that will fit your use case and will assure that the content render well. You can even do the same what Textbox.io does.

So why I wrote that in my opinion there's no reasonable solution for the problem that you reported? It's because there are so many different use cases and so many requirements, that the default behaviour cannot satisfy everyone. We chose to do less because there's less to undo by the developer. The focus should be on the content, not how its rendered. The more styles we apply and the more we alter HTML's natural behaviour inside the editor the bigger the pain for the developer and finally the user. Furthermore, I've never seen this issue reported, so I wouldn't be that sure that it's a problem for users when table automatically aligns to the content that they insert.

PS. There's a chance that we'll rebuild the old table plugin in the near future. However, I think that we'll go in the "as clean as possible" way, so the behaviour that you reported will remain.

[Dan Dascalescu]

Reinmar, thank you very much for the clarification. I understand the problem is far from trivial.