audio bar colour

if that is your code how is work on another website … you don`t have space before !important ;
put a link if your site is up so we can look.

.mejs-container, .mejs-embed, .mejs-embed body {
background: none repeat scroll 0% 0% #702437 !important;
border-radius: 6px!important;
box-shadow: 0px 4px 2px -2px #666;
}
.mejs-container .mejs-controls {
background: none!important;
}
Just tested the code again still works on the other site but the site we want it to work on it doesn’t work.

this declaration is null

.mejs-container .mejs-controls {
background: none!important;
}

use space mate … read more about css

If !important is used on css declarations, the whitespace before it is stripped, rendering the whole important and the declaration obsolete.

Even with your change doesn’t work!! Just tried this instead

.mejs-container .mejs-controls {
background-color: #F4710A !important;
}
This works on a site we have but still does’nt work one we want it to work on!

@james, what is the URL of the site you’re battling with?

Hi @robhob the url is https://www.thesongpartnership.com/catalogue/a-wing-and-a-prayer/ here is a audio player. you can see the custom css we are using it’s just not reading it. need to change the colour of player.

with the next css code i change like this picture, i don`t see where is loaded css class .mejs-container .mejs-controls in your page ?!?
for audio bar you use this class .wp-audio-shortcode

.wp-audio-shortcode {
    width: 100%;
    visibility: visible;
    background: red none repeat scroll 0% 0% !important;
}

Hello James,

I’ve played around and I can’t figure out how to override the CSS used to style the player. If you really want to get your hands dirty, you could hack away at the CSS file used to style the player, you can find it here: https://www.thesongpartnership.com/wp-includes/js/mediaelement/mediaelementplayer.min.css. You can clean it up with dirtymarkup.com. The obvious problem is, any changes made here will be lost with your next WordPress update.

Can I suggest that you rather use a plugin called Media Player Style Kit. It looks like it’ll do exactly what you’re looking for and save you a lot of time and trouble.

Cheers

Rob

@robhob Thank you for having a look. I tried yesterday testing and editing that css file it makes no effect at all ?? I have just put that plugin to try it and changed the background and doesn’t work either.

Try disabling all your plugins and see if that makes any difference. If that works, then activate them one at a time.