How to build a responsive layout without a single line of CSS*

Lucamug
6 min readSep 23, 2019

This is a tutorial on how to build a mildly complex web layout without any knowledge of CSS (and also any knowledge of Javascript and HTML for that matter).

The layout is built using Elm and elm-ui. Elm is a pure functional language that compile to Javascript. elm-ui is an Elm library that create a semantic layer on top of CSS and HTML. If you are new to Elm, the Elm official guide and the elm-ui documentation are two good starting points.

TL;DR The result

The stand-alone version: https://layout-without-css.surge.sh/

The Ellie version:

The code: https://github.com/lucamug/layout-without-css

The task

We want to build a responsive layout of a modal window that should render properly both on small and large viewports.

--

--