CSS Selector for unique Modal Window ID

  • In Progress
    Posted in: Highend WP Theme  
  • Customer
    marsthegreat
    May 20, 2019 at 9:29 pm #139267

    I am trying to customize the same modal window two different ways (with two different images) using CSS but when I preview/publish it, it uses the same image for both modal window buttons. Should I be using a different syntax to select and style an individual modal window?

    Here is the CSS I used based on previous threads to get close to the desired effect:

    a.modal-open.hb-button, #asppa-conf {
    width: 250px;
    height: 90px;
    background-image: url(http://asppaannual.org/wp-content/uploads/2019/05/ASPPA-Annual-Register-3.png);
    box-shadow: none;
    background-size: cover;
    font-size: 0;
    background-color:#28aae0;
    }

    a.modal-open.hb-button, #annual-tpa {
    width: 250px;
    height: 90px;
    background-image: url(http://asppaannual.org/wp-content/uploads/2019/04/Register-Both.png);
    box-shadow: none;
    background-size: cover;
    font-size: 0;
    background-color:#28aae0;
    }

    Using just #asppa-conf or .asppa-conf doesn’t style the button at all. Is there a better way to style the modal windows using the unique ID (data-modal-id) I set for it?

    Sorry, this forum is for verified users only. Please Login or Register to continue

Comments are closed.