CODEWITHSUNDEEP
javascriptcssangularjsmodal-dialogbootstrap-modal
deep_netprog
deep_netprog

Reputation: 75

Angular UI bootstrap modal fullscreen

Hi I have modal with custom size:

var dialog = modal.open({
                    template: content,
                    size: size,
                    
                    controller:'someController'
                    controllerAs: 'dialog'
                });
.modal-custom-lg {
    width:90%;
    max-width:1200px;
      height:100%;

}

The width works fine but the height does not work. I am trying to make my modal fullscreen. Can anyone suggest me how to make my modal fullscreen?

Upvotes: 3

Views: 11765

Answers (2)

Suraj Lama
Suraj Lama

Reputation: 86

.modal-custom-lg .modal-dialog {
    width: 100%;
    height: 100%;
}

.modal-custom-lg .modal-content {
    width: 100%;
    height: 100%;
}

Upvotes: 6

deep_netprog
deep_netprog

Reputation: 75

So I have to adjust the modal-dialog and modal-content as well not just modal size

.modal-custom-lg .modal-dialog {
  
    width: 100%;
    height: 100vh;
    
}

.modal-custom-lg .modal-content {
  
    width: 100%;
   
    height: 100vh;
 
}

Upvotes: 1

Related Questions