#firefoxbug — Public Fediverse posts

Did you know you could get the number of `auto-fit` columns of a grid by dividing the grid width (known to the grid's children/ pseudos as `100cqw` if we make the grid a container) to the unit column width `--u`?

See the live demo on @codepen https://codepen.io/thebabydino/pen/zxGyRZX

No Firefox yet... and the bug 🪲 looks like it's dormant 😿 https://bugzilla.mozilla.org/show_bug.cgi?id=1827404

#CSS #layout #cssLayout #cssMaths #grid #cssGrid #code #coding #frontend #calc #web #dev #webDev #webDevelopment #CodePen #FirefoxBug #bug

Did you know you could get the number of `auto-fit` columns of a grid by dividing the grid width (known to the grid's children/ pseudos as `100cqw` if we make the grid a container) to the unit column width `--u`?

See the live demo on @codepen https://codepen.io/thebabydino/pen/zxGyRZX

No Firefox yet... and the bug 🪲 looks like it's dormant 😿 https://bugzilla.mozilla.org/show_bug.cgi?id=1827404

#CSS #layout #cssLayout #cssMaths #grid #cssGrid #code #coding #frontend #calc #web #dev #webDev #webDevelopment #CodePen #FirefoxBug #bug

Did you know you could get the number of `auto-fit` columns of a grid by dividing the grid width (known to the grid's children/ pseudos as `100cqw` if we make the grid a container) to the unit column width `--u`?

See the live demo on @codepen https://codepen.io/thebabydino/pen/zxGyRZX

No Firefox yet... and the bug 🪲 looks like it's dormant 😿 https://bugzilla.mozilla.org/show_bug.cgi?id=1827404

#CSS #layout #cssLayout #cssMaths #grid #cssGrid #code #coding #frontend #calc #web #dev #webDev #webDevelopment #CodePen #FirefoxBug #bug

Did you know you could get the number of `auto-fit` columns of a grid by dividing the grid width (known to the grid's children/ pseudos as `100cqw` if we make the grid a container) to the unit column width `--u`?

See the live demo on @codepen https://codepen.io/thebabydino/pen/zxGyRZX

No Firefox yet... and the bug 🪲 looks like it's dormant 😿 https://bugzilla.mozilla.org/show_bug.cgi?id=1827404

#CSS #layout #cssLayout #cssMaths #grid #cssGrid #code #coding #frontend #calc #web #dev #webDev #webDevelopment #CodePen #FirefoxBug #bug

Just found my first Firefox bug which was reproducible.

It's an awesome feeling to know that you did help even if it is a small issue found.

#Firefox #BugReport #FirefoxBug

2️⃣ Then there's this Firefox bug some rando 🤪 filed over half a decade ago https://bugzilla.mozilla.org/show_bug.cgi?id=1481498

If we have multiple backgrounds and one is clipped to text, the top background layer image is painted all across the area of all the backgrounds stacked one on top of the other. 😭

#Firefox #bug #FirefoxBug #CSS #code #coding #frontend #web #dev #webDev #webDevelopment

So apparently something got broken in Firefox Nightly (all fine in stable) - thanks @simevidas for pointing it out!

Filed a #bug:
https://bugzilla.mozilla.org/show_bug.cgi?id=1915924

#SVG #svgBug #Firefox #FirefoxBug #svgFilter #filter #code #coding #frontend #web #webDev #dev #webDevelopment

I really meant to write "hello world" there, but "hell" isn't wrong, so I left it like that.

Anyway, you can find the bug links & all in the Pen description.

#SVG #svgFilter #filter #svgBug #bug #FirefoxBug #SafariBug #code #coding #textEffect #noise #grainy #frontend #web #webDev #dev #webDevelopment

For inline elements, things get worse: the only available fix requires nesting in order to set the gradient clipped to text on child and the other, full coverage gradient on parent.

For ex, for such a link hover effect (https://css-tricks.com/taming-blend-modes-difference-and-exclusion/#aa-text-state-change-effect), we need a `<span>` in the `<a>`.

#bug #Firefox #FirefoxBug #CSS #cssBug #code #coding #frontend #web #webDev #webDevelopment #cssGradient

Re Firefox bug: workaround options.

In a lot of cases, an absolutely positioned pseudo covering the entire element's area https://twitter.com/anatudor/status/1478412237295566850 and placed behind with `z-index` will do.✅

Can't use `box-shadow`/ `border-image` since they get drawn *on top* of the gradient background clipped to `text`. 😞🫠

#bug #Firefox #FirefoxBug #CSS #cssBug #code #coding #frontend #web #webDev #webDevelopment #cssGradient

Pure CSS text effect https://codepen.io/thebabydino/details/XWQQRWG

No text duplication, no JS, no images save for CSS gradients, no SVG at all. Under 20 CSS declarations, including layout, prettifying, `@​media` queries, `@​supports` blocks, CSS variable declarations...

No Firefox (bug 🪲 1481498 ).

Heavily commented as well.

#CSS #textEffect #cssGradient #blending #blendMode #code #coding #frontend #webDev #webDevelopment #bug #Safari #SafariBug #FirefoxBug #Firefox #CodePen #noJS #noSVG #mediaQuery #typography

And this means I've filed an #svgFilter #bug 🪲 in every major browser today https://bugzilla.mozilla.org/show_bug.cgi?id=1883933

Bottom line: almost nothing works cross-browser when it comes to SVG filters.

#SVG #CSS #filter #Firefox #FirefoxBug #code #coding #frontend #webDev #webDevelopment

Firefox does a really weird thing when `background-clip` has multiple values, one of the being `text`.

It takes the area occupied by all the background layers stacked all on top of the other (think of it as a union of sets) and paints the top layer `background-image` across that entire area.

Test case https://codepen.io/thebabydino/pen/oNJqrVd

🐞 https://bugzilla.mozilla.org/show_bug.cgi?id=1481498

#firefox #bug #firefoxBug #CSS #coding #frontend #webDev #webDevelopment

We found a fairly glaring bug in #Firefox that affects Tor. That we thought was actively fixed years ago.

Cannot discuss further.

Any genuine #Firefox or #TorBrowser devs on fedi?

#FirefoxBug #TorBrowserBug #Mozilla

📬 Firefox Bug nach mehr als 17 Jahren endlich behoben
#Kurios #Softwareentwicklung #Bugzilla #CSSpseudoElement #Firefox #Firefox110 #FirefoxBug #firstletter #Mozilla https://tarnkappe.info/artikel/kurios/firefox-bug-nach-mehr-als-17-jahren-endlich-behoben-261568.html

@adnan360
The difference in font size is huge. Entire fontsize is approx. 50% larger by adding 'courier' before 'monospace'. It's either a #FirefoxBug or a #TorBrowserBug in our honest opinion.

Don't get me wrong though it looks nice at the bigger size.

In fact that could explain why the line-height is buggy on your end too! What browser are you using?