From 09e654b09b86f1331fe9c939bd08b8f74c97881e Mon Sep 17 00:00:00 2001 From: Adam Porter Date: Sat, 16 Mar 2024 22:59:18 -0500 Subject: [PATCH 2/2] * html/layout.css: Improve readability of DL elements (dl): Don't decrease font size. Indent list slightly to set off from body text. (dt): Don't limit width. Don't display inline. Ensure small margin above each term. (dd): Don't limit width. Don't display inline. While DL lists might be expected to be, e.g. a glossary, where each DT element is just one term, these lists are commonly used for other purposes, in which DT elements may be a sentence or more; this is especially so for some ELPA packages' manuals which are exported to HTML from Org files. Cramming these terms into a narrow column next to their definition makes such lists hard to read. Instead, this change puts the terms and definitions on their own lines. --- html/layout.css | 19 ++++--------------- 1 file changed, 4 insertions(+), 15 deletions(-) diff --git a/html/layout.css b/html/layout.css index 6d0dc4a5ff..f14a8ff4f9 100644 --- a/html/layout.css +++ b/html/layout.css @@ -168,24 +168,13 @@ p.centered { } dl { - margin: 30px 0; - font-size: .8em; + margin: 30px 2em; } dt { - font-weight: bold; - width: 300px; - display: inline-block; - vertical-align: top; -} - -dd { - /* We should reduce vertical space use in the "header". - Yuan Fu suggested to do that simply by - commenting this out: - margin-bottom: 10px; */ - width: 460px; - display: inline-block; + font-weight: bold; + margin: 0.25em 0 0 0; + vertical-align: top; } .button { -- 2.30.2