From d22c3f84aca81ba59b3c04631d88bc5929a77fbc Mon Sep 17 00:00:00 2001
From: "Brian S. Stephan" <bss@incorporeal.org>
Date: Tue, 24 Feb 2026 09:55:21 -0600
Subject: [PATCH] have floating img/figure clear their side, to avoid
 "waterfalls"

I have many things floating to the right on the ttrpg site, where the
first would be most right, the second would be right but left of the
first thing, and so on. this forces those to clear their respective side
and create a quasi-column of things rather than making a bizarre ratchet
of content.

.......... A
.......... A
.......... B
(good)

vs.

.......... A
........ B A
(bad)

I can't see why I'd want the bad behavior on my other sites, but I'll
just mention that I didn't check to see what they were doing

Signed-off-by: Brian S. Stephan <bss@incorporeal.org>
---
 incorporealcms/static/css/base.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/incorporealcms/static/css/base.css b/incorporealcms/static/css/base.css
index 0ea1daf..a1144e7 100644
--- a/incorporealcms/static/css/base.css
+++ b/incorporealcms/static/css/base.css
@@ -118,17 +118,20 @@ img {
 
 .img-center {
     display: block;
+    clear: both;
     margin-left: auto;
     margin-right: auto;
 }
 
 .img-left {
     float: left;
+    clear: left;
     margin-right: 1em;
 }
 
 .img-right {
     float: right;
+    clear: right;
     margin-left: 1em;
 }
 
@@ -144,12 +147,14 @@ figure {
 
 figure.right {
     float: right;
+    clear: right;
     margin-left: 10px;
     display: block;
 }
 
 figure.left {
     float: left;
+    clear: left;
     margin-right: 10px;
     display: block;
 }