images in j-f1’s “data cards” notebook

[jrus]

I noticed that in @j-f1’s notebook …

Data Cards

… the images show up in chrome but not firefox. They are specified using

<a style="--src: url('${image}'); --fit: ${imageFit || 'cover'}" ...

I have not seen this CSS attribute set on an anchor element before, and a quick google search isn’t turning up much. Is this a new CSS/HTML feature? Some Chrome-only thing?

[mootari]

@jrus

I have not seen this CSS attribute set on an anchor element before

These are custom properties, basically CSS variables. There are referenced further below inside the <style> element.

Btw, can you share a screenshot and your Firefox version? Because I’m seeing the image in FF.

[jrus]

I’m using Firefox 66 on a Mac. Could be if I update to 68 it would work. Is this a very new feature?

[mootari]

@jrus

Is this a very new feature?

Nope: Can I use... Support tables for HTML5, CSS3, etc

[jrus]

Hmm, in the inspector it says “could not load the image”

But if I navigate to that image directly in the browser it loads fine. No idea what the issue is.

[mootari]

I can replicate it in a private window. The reason is tracking protection: