CSS Child / Surviving Contact

Your layout is finished only once bad content has been through.

A design that works with the content you invented has not been tested at all.

You build a card. It has a short title, a two line description and a neat little image, and the row of them looks lovely. Then the real content arrives and one title runs to fourteen words, one description is a single word, one item has no image, and one contains a product code that will not break onto a second line. The row is now a shambles. Nothing went wrong technically. You designed for a sample rather than for a range, and a sample is a photograph of one moment rather than a description of a behaviour.

The remedy is a habit and it takes minutes. Before you consider anything finished, put deliberately hostile content through it. Make one title absurdly long and one absurdly short. Empty a field entirely. Insert a very long unbroken string of characters. Put in three items, then thirty. Every one of these will reveal something, and the things they reveal are exactly the things that would otherwise be discovered by a real person on a real day when you are not there to fix it quickly. It is far more valuable than any amount of adjustment made against content you invented.

This is also the most reliable way to tell whether you have understood the earlier articles. A design built on stated intent tends to bend under bad content: things wrap, regions grow, the arrangement absorbs the difference and remains legible. A design built on measured coordinates tends to break: things overlap, text escapes its container, a row that fitted exactly now does not. The failure mode tells you which kind of design you built, and if it is the second kind, the fix is not more numbers but a return to describing what you actually meant.