Ich versuche, einen wartenden Bildschirmmodaldialog in der Mitte des Bildschirms zu zentrieren. Hier ist der modale Dialog, den ich versuche zu ändern: Ссылка . Wie zentriere ich es horizontal und vertikal?
Dies ist nur eine Frage der Anwendung von CSS auf die pleaseWaitDialog ID. Sie müssen position:absolute und die margin-top und margin-left müssen die Hälfte der Höhe und Breite haben. Ihr CSS sollte also ungefähr so aussehen:
Sie müssen mit den Zahlen spielen, um die Boxgröße zu erreichen, die zu dem passt, was Sie wollen, aber das sollte Ihnen den Einstieg erleichtern.
Hier ist ein weiterer Vorschlag, der keine harte Codierung der Ränder beinhaltet. Es verwendet Angular, aber Sie können Element durch $ ersetzen. Es animiert den Rand und simuliert die "Fade" -Klasse im Bootstrap.
%Vor%Für Standard jQuery / Coffeescript verwendete ich:
%Vor%Der ganze Kredit geht an Sergey Barskiy.
Ich habe ein solches Problem beim Versuch, Bild (mit beliebiger Größe) in Angulars UI Bootstrap Modal zu zeigen, getroffen. Also
Ich habe den zusätzlichen Klassennamen "width-auto" an einen Dialog div "modal" angehängt. (In meinem Fall wurde das mit Hilfe des Parameters "windowClass" gemacht)
Ich habe SCSS-Code geschrieben:
.breite-automatisch { & amp; .modal { Textausrichtung: Mitte; } .modal-dialog, .modal-Inhalt { Anzeige: Inline-Block; Breite: Auto; maximale Breite: 99vw; Überlauf versteckt; } }
und es hat das Problem gelöst.
Tags und Links twitter-bootstrap modal-dialog