quatuorbellefeuille.com

commit 3b43a7375eef01df06f216dec1adf380fe9d5da7
parent abd9e189b472d90cc592d50555ca107e83bba3a2
Author: Kévin Le Gouguec <kevin.legouguec@gmail.com>
Date:   Wed, 18 Nov 2020 20:17:09 +0100

Mitigate ugly title wrapping

IIUC, CSS starts by computing block dimensions; when "Quatuor XXXX"
becomes too big, it picks the max-width; *then* CSS barfs the text
into the block, and finally notices that the text will wrap.  Cue ugly
blank space on the right.

https://old.reddit.com/r/css/comments/2y1d6w/fit_block_width_to_content_when_text_wraps_due_to/

Diffstat:
M
commun.css
 | 
2
+-

1 file changed, 1 insertion(+), 1 deletion(-)
diff --git a/commun.css b/commun.css
@@ -15,7 +15,6 @@ header.banner {
 header.banner .brand {
     display: flex;
     align-items: center;
-    max-width: 40%;
 }
 
 header.banner .brand img {
@@ -23,6 +22,7 @@ header.banner .brand img {
 }
 header.banner .brand h1 {
     transition: color 1s;
+    text-align: center;
 }
 header.banner .brand:hover img {
     filter: brightness(100%) sepia(100%);