center horizontally a modal with full heigth

Topic: center horizontally a modal with full heigth

yeisonvelez11 free asked 5 years ago

I want to center a modal horizontally, as long as it occupies 100% of the height of the screen. I do not know what I'm doing wrong.

enter image description here

    <div mdbModal #detallereuniones="mdbModal" class="modal fade" id="reuniones" tabindex="-1" role="dialog"
      aria-labelledby="crearentregable" aria-hidden="true" [config]="{backdrop: true, ignoreBackdropClick: true}">
      <div class="modal-dialog modal-lg modal-full-height" role="document">
        <div class="modal-content ">
        .
        .
        .

Add comment

Damian Gemza staff answered 5 years ago

0 0 Best answer

Dear yeisonvelez11,

Please add the .mx-auto class to the div with .modal-content class and your modal will be centered horizontally.

Best Regards, Damian

yeisonvelez11 free commented 5 years ago

it not works for me..

<div mdbModal #detallereuniones="mdbModal" class="modal fade" id="reuniones" tabindex="-1" role="dialog"
  aria-labelledby="crearentregable" aria-hidden="true" [config]="{backdrop: true, ignoreBackdropClick: true}">
  <div class="modal-dialog modal-lg modal-full-height" role="document">
    <div class="modal-content mx-auto">

I need full heigth and center horizontally in my modal..

https://i.imgur.com/pjgcBo2.jpg

Arkadiusz Idzikowski staff commented 5 years ago

Please try to overwrite 'modal-full-height' class:

.modal-full-height { left: 0 !important; margin: 0 auto !important; }

Add comment