Flexa Block Pro

The Data Table Block: Your Rows and Columns, Readable at a Glance

Build a table from your own columns and rows, align each one, stripe the rows and style the header — so structured data reads clearly instead of blurring into a wall of text.

Structured data hates being plain text

You’ve got a set of specs, a schedule, or a feature breakdown — the kind of thing that only makes sense as rows and columns. So you paste it in and it collapses into a run-on paragraph, or you fight the editor’s plain table and end up hand-writing CSS to get the header to look like a header and the numbers to line up. Change one column later and the whole thing drifts out of shape again.

The Data Table block gives that information a proper grid. You type your columns and rows straight in, and the styling that makes a table readable is a set of switches, not a stylesheet.

Your own columns and rows, aligned per column — type the data in and set each column left, centre or right, so labels read from the left and figures line up on the right.
Striped rows and a hover highlight — alternating row shading plus a highlight that follows the cursor, so your eye tracks across a wide row without slipping onto the wrong line.
A styled header and an optional bold first column — the labels that frame the data stand apart from it, so the table reads as a table and not a block of cells.
Cell borders and a width cap that scrolls — grid lines separate every cell, and a table wider than its space slides sideways instead of squashing its columns to nothing.

Setting one up takes a minute. Add columns and rows with a button, type into each cell, choose an alignment from the dropdown, and flip on stripes, hover and a header background from the sidebar. The preview updates as you go — no CSS, no shortcode, nothing to remember.

Striped rows, styled header, hover highlight. The default reading setup — alternating shading and a green header, with each row lighting up as the cursor passes over it.

NameRoleLocation
Jane OkoroLead DesignerBerlin
Mateo RossiFront-end DeveloperLisbon
Priya NairContent StrategistBristol
Sofia AlmeidaProject ManagerPorto

First column locked as a label spine. The same block with the first column highlighted, so a schedule reads down its row labels while your eye scans across the days.

StudioMorningAfternoonEvening
Studio APilatesOpen floorYoga
Studio BBoxingSpinDance
Studio CStretchStrengthMeditation

Right-aligned figures, header hidden. The same block with the header switched off and the number columns aligned right, so the digits stack cleanly for a compact reference strip.

Ridge Loop8.2 km410 m2h 40m
River Path5.6 km120 m1h 30m
Summit Track11.9 km880 m4h 05m
Meadow Walk3.1 km60 m0h 55m

Ready to lay out your own data?

The Data Table block ships with Flexa Block. Install it and it’s waiting in the editor the next time you open a page — the live tables above are the same block.

Download Flexa Block
More articles

Keep reading

Other guides from the Flexa Blocks library.

48 posts found