Alert Controller - css button


#1

I am making an ionic app with version 3.20.0. I’m using alert controller and I add three button ,Annuler ,ok and Scan.
I want to place it like in the photo below:

my css code in ionic like that:

   showPrompt() {
    this.donebtn = true;
    let prompt = this.alertCtrl.create({
      title: 'Espace Client',
      message: "Tapez votre code secret",
      cssClass: 'myalert',
      inputs: [{
        name: 'code',
        placeholder: 'Mot de passe',
        type: 'password',
      }, ],
      buttons: [{
        text: '',
        handler: data => {
          this.scannerCAB();
          let pass = this.votreCode;
          this.verifierclient(this.codeclient, pass);

          // console.log('Barcode data', this.votreCode);
          // let pass = data.code;
          //this.verifierclient(this.codeclient, pass);
        }
      },{
          text: 'Annuler ',
          handler: data => {

          }

        },

        {
          text: 'ok ',
          handler: data => {
            let pass = data.code;
            this.verifierclient(this.codeclient, pass);
          }
        },
      ]
    });
prompt.present({
    keyboardClose: false
  })
  .then(() => this.donebtn = false);

and my css code

 .myalert .alert-wrapper {
        padding: 0;
        flex-wrap: wrap;

        input.alert-input:nth-child(1){
            flex: 0 0 60%;
            max-width: 80%;
        }
     button.alert-button:nth-child(1) {
        background-image:url('../assets/imgs/icon.png');
        background-repeat: no-repeat;
        background-position: center;
        max-width: 40%;
    }  
    }
    .myalert button.alert-button-group {
        flex: 0 0 50%;
        max-width: 50%;

    }

    .myalert .alert-button-group-vertical {
      flex-direction: row;
    }