Back to top


Grid-like Definition list layout using Flexbox

Definition list laid out in a grid/table

Modern web design often features “vanity metrics”; KPIs indicating company's successes or listing distinguishable features. The most appropriate HTML element to mark up such content is the definition list <dl>.

Designs often call for a grid-like layout for such content. This article shows how to build the CSS for the scalable vertical grid-like definition list layout using Flexbox CSS.

Subscribe to CSS