diff options
| author | Xe Iaso <me@christine.website> | 2022-04-07 17:53:01 +0000 |
|---|---|---|
| committer | Xe Iaso <me@christine.website> | 2022-04-07 17:53:12 +0000 |
| commit | 20aeb35890533fdc930950de24b5c0acaefc6e85 (patch) | |
| tree | dc45af5916704b7989ecd466eaeb0b3b36b37fc1 /css | |
| parent | 449ddabce16d68d2b9fc6522bf03ff9a9bacfcec (diff) | |
| download | xesite-20aeb35890533fdc930950de24b5c0acaefc6e85.tar.xz xesite-20aeb35890533fdc930950de24b5c0acaefc6e85.zip | |
css: fix conversation width in the HTML element
> Add min-width:0 to .conversation-chat in shim.css. This is not only a
> fix, but the correct fix.
>
> But WTF?
>
> Well quite simply, the default value of min-width is auto, which
> normally acts like 0, but for a flex item, auto becomes something more
> along the lines of min-content (except special complicated rules that I
> don't fully understand apply). The net result is that the minimum width
> prevents the code boxes in the conversation from using their overflow:
> auto to enable scrolling. Setting min-width: 0 is effectively just
> turning this special rule off, and causing it use more normal box sizing
> rules.
>
> I hate how weird and impossible to understand the css box model is.
Signed-off-by: Xe Iaso <me@christine.website>
Diffstat (limited to 'css')
| -rw-r--r-- | css/shim.css | 1 |
1 files changed, 1 insertions, 0 deletions
diff --git a/css/shim.css b/css/shim.css index c536a7d..f67767b 100644 --- a/css/shim.css +++ b/css/shim.css @@ -36,6 +36,7 @@ img { .conversation-chat { align-self: center; + min-width: 0; } .gruvbox-dark pre, pre { |