aboutsummaryrefslogtreecommitdiff
path: root/html/MOZILLA_scrollbar_fix.css
diff options
context:
space:
mode:
Diffstat (limited to 'html/MOZILLA_scrollbar_fix.css')
-rw-r--r--html/MOZILLA_scrollbar_fix.css46
1 files changed, 46 insertions, 0 deletions
diff --git a/html/MOZILLA_scrollbar_fix.css b/html/MOZILLA_scrollbar_fix.css
new file mode 100644
index 0000000..5feb7c3
--- /dev/null
+++ b/html/MOZILLA_scrollbar_fix.css
@@ -0,0 +1,46 @@
+/**
+ * Hachette
+ * Hacky fix for vertical scrollbar width being included in child's width.
+ *
+ * Copyright (C) 2021 Wojtek Kosior
+ * Redistribution terms are gathered in the `copyright' file.
+ */
+
+/*
+ * Under Mozilla browsers to avoid vertical scrollbar forcing horizontal
+ * scrollbar to appear in an element we add the `firefox_scrollbars_hacky_fix'
+ * class to an element for which width has to be reserved.
+ *
+ * This is a bit hacky and relies on some assumed width of Firefox scrollbar, I
+ * know. And must be excluded from Chromium builds.
+ *
+ * I came up with this hack when working on popup. Before that I had the
+ * scrollbar issue with tables in the options page and gave up there and made
+ * the scrollbal always visible. Now we could try applying this "fix" there,
+ * too!
+ */
+
+.firefox_scrollbars_hacky_fix {
+ font-size: 0;
+}
+
+.firefox_scrollbars_hacky_fix>div {
+ display: inline-block;
+ width: -moz-available;
+}
+
+.firefox_scrollbars_hacky_fix>*>* {
+ font-size: initial;
+}
+
+.firefox_scrollbars_hacky_fix::after {
+ content: "";
+ display: inline-block;
+ visibility: hidden;
+ font-size: initial;
+ width: 14px;
+}
+
+.firefox_scrollbars_hacky_fix.has_inline_content::after {
+ width: calc(14px - 0.3em);
+}