html
css
twitter-bootstrap-3
Дамара Джати П.
источник
источник
Ответы:
В вашем коде для
modal-dialog
div добавьте еще один классmodal-lg
:Или, если вы хотите центрировать модальный диалог, используйте:
источник
Самый простой способ - использовать встроенный стиль для
modal-dialog
div:источник
В моем случае,
modal-lg
Класс не был достаточно широк.так что решение было
и используйте указанный выше класс вместо
modal-lg
классаисточник
Вы можете выбрать между
modal-lg
иmodal-xl
классами , или если вы хотите пользовательскую ширину затем установите максимальную ширину свойство с встроенным CSS. Например,или
источник
В Bootstrap 3 вам нужно изменить модальный диалог. Итак, в этом случае вы можете добавить класс modal-admin на место, где стоит modal-dialog.
источник
В Bootstrap ширина по умолчанию
modal-dialog
составляет600px
. Но вы можете явно изменить его ширину. Например, если вы хотите увеличить его ширину до значения по вашему выбору,800px
например, вы делаете следующее:Примечание . Это изменение распространяется на все модальные диалоговые окна, которые вы используете в своем приложении. Кроме того, я предлагаю вам определить свои собственные правила CSS и не затрагивать ядро фреймворка.
Если вы хотите, чтобы он был установлен только для определенного модального диалога, используйте собственное броское имя класса
modal-800
, ширина которого установлена800px
, как показано ниже:HTML
CSS
Точно так же вы можете иметь имя класса, основанное на размере ширины, например,
modal-700
чья ширина700px
.Надеюсь, это поможет!
источник
У меня была большая сетка, которую нужно было отобразить в модальном окне, и простое применение ширины к телу работало некорректно, поскольку таблица была переполнена, хотя на ней были классы начальной загрузки. В итоге я применил ту же ширину
modal-body
иmodal-content
:источник
Если вы хотите сохранить адаптивность модального окна, используйте% ширины вместо пикселей. Вы можете сделать это в режиме онлайн (см. Ниже) или с помощью CSS.
Если вы используете CSS, вы даже можете делать разные% для modal-sm и modal-lg.
источник
Я также столкнулся с той же проблемой при увеличении ширины модального окна не отображается в центре. После работы я нашел решение ниже.
источник
Фактически, вы применяете CSS к модальному div.
вам нужно применить CSS к .modal-dialog
Например, см. Следующий код.
Bootstrap также предоставляет классы для установки ширины div.
Для небольшого модального использования
modal-sm
И для больших модальных
modal-lg
источник
Самый простой способ сделать это:
где мы можем указать ширину модального окна в процентах от экрана.
Вот рабочий пример, демонстрирующий то же самое:
источник
В вашем коде для div модального диалога добавьте еще один класс, modal-lg:
использовать modal-xl
источник
Я полагаю, это происходит из-за того, что максимальная ширина модального окна установлена на 500 пикселей, а максимальная ширина модального lg составляет 800 пикселей. Я полагаю, что установка его на auto сделает ваш модальный отзывчивым
источник
значение margin left составляет половину ширины модального окна. Я использую это с темой администратора Maruti, так как у нее нет класса
.modal-lg .modal-sm
источник