Archived topic

Sonaar mp3 player plugin: CSS align center with 1100px width

3 replies · Started by Matthias on February 23, 2020

Viewing posts 1–4 of 4

February 23, 2020 at 1:38 am #1174134

Hey there,

default width of the Sonaar mp3 player plugin is 100%. But it would be cool if the player get a width of 1100px and is positioned in center like the other website content. (Start the mp3 player by clicking on the cover)

This btw. is a woocommerce single product template made with Elementor Pro.

Following CSS style code does not work:

#sonaar-player {
width: 1100px !important;
max-width: 1100px !important;
align-items: center !important;
margin-left: 100px !important;
margin-right: 100px !important;
}

#sonaar-player {
width: 1100px !important;
max-width: 1100px !important;
align-items: center !important;
margin-left: 50% !important;
margin-right: 50% !important;
}

Any ideas or solutions would be so cool!

Many thanks!

February 23, 2020 at 9:38 am #1174527

Hi there,

Try adding this CSS:

#sonaar-player {
    left: 50%;
    transform: translate3d(-50%, 94px, 0);
}

#sonaar-player.enable {
    max-width: 1100px;
    left: 50%;
    transform: translate3d(-50%, 0, 0);
}

February 23, 2020 at 9:42 am #1174530

Oh my god, yes!!!

Thank you very much!

(with

!important

it does work fine, yeah!

Many, many thanks!

February 23, 2020 at 6:05 pm #1174765

You're very welcome :)

This archived topic is closed to new replies.

Start building better websites today.