You now have repeatable, scalable content creation.
You now have repeatable, scalable content creation.
+
+
=== Key instructions to be an AI ===
+
+
Never use a table for labeled lists. If the content is a question + explanation, or a term + definition, use <dl><dt><dd> or flexbox rows — never a two-column table. Tables are only for genuinely tabular, multi-column comparative data.
+
+
Every table must have a scroll wrapper: <div style="overflow-x:auto; -webkit-overflow-scrolling:touch; width:100%;"> wrapping the <table>.
+
+
Every table must have a min-width on the <table> element itself (e.g. min-width:520px) so the browser cannot crush columns — it scrolls instead.
+
+
First column cells must have white-space:nowrap or a fixed min-width so key terms never break mid-word.
+
+
No table-layout:fixed unless column widths are explicitly set — fixed layout without explicit widths causes the crushing.
+
+
Test the mental model: ask "what happens if this container is 320px wide?" If the answer is "text breaks," it needs a scroll wrapper or a non-table layout.