Three-Column · Fluid Layout

Fluid Three‑Column Layout
with embedded typography

This exercise converts a fixed-width design into a fluid percentage-based layout. The container is set to width: 78%, capped with max-width: 1260px and min-width: 780px to maintain readability on very large or small screens. The three columns use a grid of roughly 20% / 60% / 20% (via 20% 1fr 20% plus internal padding).

About the imagery

The photo above is niceday.jpg, placed in the middle column. All image paths are consistent with the original index.html. The background remains skynight.jpg to preserve the unified visual style.

This page includes a link back to the homepage (index.html) in the navigation and left column. The typefaces are Google Fonts Lora for body text and Barlow Condensed for headings – a distinct yet elegant pair that differs from the original Gill Sans / Verdana while keeping the same aesthetic.

“Design is not just what it looks like and feels like. Design is how it works.” — This layout demonstrates both.

More sample links: example link one, example link two, and MDN grid documentation. All links retain the original orange‑brown accent (#d67b0c).