Make the audio player responsive

  • Resolved alden20

    (@alden20)


    2 years, 2 months ago

    Hi,

    I have a problem: the audio player is not responsive. On the web page in desktop mode the player is displayed correctly. But when I view the page on mobile, the player goes off screen. I’ve tried to fix it by changing the width of the widget using percentage instead of a fixed pixel size, but it doesn’t work, the fonts stay the same size and stick out of the player, the image is displayed as a small icon… It looks completely wrong.

    Please, I wanted to ask you if there would be any possibility of making the audio player responsive, in such a way that when it is viewed on a mobile the size of all its components is modified so that they fit well on the screen.

    Regards.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter alden20

    (@alden20)

    Hi again,

    I think I managed to solve it by adding the following CSS code:

    .sidebar-right .hentry .bpMp3Player{
   max-width:556px;
   width:100% !important;
}

    By doing it that way, the player resizes correctly when viewed on mobile.

    Regards.

    Plugin Author Charles Cormier

    (@charlescormier)

    Hi @alden20,

    We added max-width: 100%; in .bpMp3Player in new version, now it’s responsive, you can remove that code for test. Please update the plugin to the new version.

    Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Make the audio player responsive’ is closed to new replies.