How to fix the different result in chrome and firefox

hi campers,

i used to do this inline style for audio:

 <audio controls controlsList="nodownload" src="/"></audio>

but will show error with the W3C Validator.
i tried to use property in CSS

audio {
  controlsList: nodownload; }

i know that CSS property work well in firefox to disable download option, but never work if i open it on chrome, there still showing download option.
is there any property that would preventing the download option for chrome using CSS?

thanks in advance.

Hello~!

The code works as intended, I believe. The validator throws an error because controlsList is still experimental and may not necessarily work on all browsers.

1 Like

thanks @nhcarrigan

so i guess i just have to ignored that error on w3c validator. since if i using inline style, it preventing download on chrome.


The errors from the validator are important, still.

Because controlsList is experimental, it’s possible that it will cause your code to render incorrectly on some browsers. It’s up to you if that risk is worth the reward. :slight_smile:

hi @nhcarrigan

this what im asking like the image below

on chrome browser

all audio i use property controlsList in css
the first audio i used inline styling too
the second is depend on css

im working on my second landing page

hi campers,

i need help how to fix different result in chrome and firefox, as i seen the result in codepen is exactly like in the firefox.
https://cdpn.io/sobadrdb/debug/bGEbbbz/xnrabZKPJzdA

different in Chrome and Firefox


Chrome browser


Firefox browser same as codepen.

thanks in advance.