Search code examples
htmlhtml-tableword-wrap

One-row table with fixed height and flexible width


How to create the one-row table, that has fixed TR height (the limit is two rows), but each TD has flexible width and forced word-wrapping.

The main question: is it possible to force each TD to use always the complete height (use two rows) when there is more then one word, i. e. if TD contains one word it should be displayed in one row, if TD contains more then one word it should be displayed in two rows (in this case browser should set the TD width automatically).


Solution

  • This appears to be impossible. The table layout mechanism tries to avoid line breaks inside cells when there is enough horizontal space. By setting e.g. width: 0 on the cells, you could override this so that the browser makes each cell as narrow as possible (effectively, as wide as the widest word, in the case of pure text content), but then e.g. three words make three lines, causing the height setting to be overridden.

    If you specify the context and purpose of wanting such a layout, perhaps a new, solvable problem can be formulated.