Angular-UI modal window height
To tame the height of the dialog, I did the following:
Put this on the modal.open config to avoid clashes with other dialogs
windowClass: 'your-modal-class',
Then in my css I added this:
div.your-modal-class .modal-content {
max-height: 600px;
overflow: auto;
}
Related videos on Youtube
0xAX
I'm a software engineer with a particular interest in the Linux, git, low-level programming and programming in general. Now I'm working as Erlang and Elixir developer at Travelping. Writing blog about erlang, elixir and low-level programming for x86_64. Author of the Linux Insides book. My linkedin profile. Twitter: @0xAX Github: @0xAX
Updated on September 14, 2022Comments
-
0xAX over 1 year
I'm trying to make modal window with angular-ui-0.6.0 and bootstrap-3.0.
My template is:
<div class="modal-header"> <h3>Create new entry</h3> </div> <div class="modal-body" ng-repeat="e in create_elements"> <label>Test</label> <input class="form-control" style="height: 30px; width: 98%" type="text" required ng-model="e.model"></input> <label id="{{e.label}}" style="display: none; color: red;">{{e.label}} - can't be empty</label> </div> <div class="modal-footer"> <button class="btn btn-success" ng-click="create(create_elements)">Create</button> <button class="btn btn-warning" ng-click="close()">Cancel</button> </div>
css for modal:
.modal { display: block; }
Modal window opens normally, but it's height is more than need. I tried to set up
height: auto
for.modal
but it didn't help.You can see white place under footer, how to remove it?
Thank you.!