I think OP's point was that the trick to vertical centering involves wrapping a div as a table cell and then vertically aligning that. It should be much simpler, like 'text-align:center'
Absolute centering only works when the element you are trying to center has a defined height. If you are trying to center an element with unknown height inside a container with unknown height, the table-cell is likely the front-runner, sadly.
Why would you want to do that? That sounds absolutely horrific.
Just center the div in absolute mode. You need to have it wrapped in something though, to have something to center against, but you shouldn't have tables in there unless you want them.
The point remains that centering vertically with absolute positioning does not work with an element of variable height. Meanwhile, horizontally centering something of variable width is dead simple. Why the difference? It's a shortcoming of CSS.
There is a fundamental reason for the difference: in standard CSS block/inline layout, widths depend on parent widths, but heights depend on child heights. Far from being stupid, this difference is the entire reason CSS is parallelizable at all.
Flexbox makes this simpler by switching to an entirely different model, which is the right approach for UIs (as opposed to documents). But I can't really fault CSS 2.1 for not introducing flexbox right away, because CSS 2.1 is complex enough as it is.
