Simple 2-Column Flex Code Generator

This generator is intended to provide copy-and-paste code for use where 2 flex columns are desired.

The 2 columns may be used for the entire width of a web page. The 2 columns may also be used for a container on the web page — examples are a regular content column or a cell within a table.

Note that even when the 2 columns are in a separate container on the web page, the width that determines at what point the boxes are stacked is the width of the browser window, not the width of the separate container.

To disable stacking (always keep it 2 columns), specify 1 pixel for stacking the boxes at a certain browser window width.

Illustrations

Generated CSS and HTML