Problem css mp3 player

Resolved maxpg
(@maxpg)

7 years, 7 months ago

Hi everyone :-).
I have a problem with the display of the mp3 player commands on the page.
A gray square appears above the play button and mutes when you go to the buttons with the mouse and after it is clicked.

The player is immediately below the image of the post.

I wish there were not this annoying square. How can I do?
Thank you all for your help 🙂

The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)

(@anevins)

WCLDN 2018 Contributor | Volunteer support

In the “Additional CSS” section of the dashboard add this:


.colors-dark .mejs-controls button:hover {
    background-color: transparent;
    background-image: url(/wp-includes/js/mediaelement/mejs-controls.svg);
}

.colors-dark .mejs-fullscreen-button>button {
    background-position: -80px 0
}

.colors-dark .mejs-unfullscreen>button {
    background-position: -100px 0
}

.colors-dark .mejs-mute>button {
    background-position: -60px 0
}

.colors-dark .mejs-unmute>button {
    background-position: -40px 0
}

.colors-dark .mejs-play>button {
    background-position: 0 0
}

.colors-dark .mejs-pause>button {
    background-position: -20px 0
}

.colors-dark .mejs-replay>button {
    background-position: -160px 0
}

.colors-dark .mejs-volume-button {
    position: relative
}

https://codex.ww.wp.xz.cn/CSS#Custom_CSS_in_WordPress

Thread Starter

maxpg

(@maxpg)

7 years, 7 months ago

I also added this:

.colors-dark .mejs-controls button: focus {
background-color: none;
background-image: url (/wp-includes/js/mediaelement/mejs-controls.svg);
}

now it seems to work perfectly! 🙂

Thanks again! You are the best !! 🙂

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Problem css mp3 player’ is closed to new replies.