5
Tôi có mô hình khởi động với dạng nằm ngang và hiện tại có height: 80vh;. Tôi muốn phương thức này lớn và tôi hài lòng với nó.Bootstrap modal-footer không nằm dưới đáy phương thức
Sự cố là modal-footer không hoạt động chính xác. Thay vì bám vào phía dưới, nó chiếm một phần lớn của không gian đó phải thuộc về các lĩnh vực đầu vào:
Tôi muốn buộc các modal-footer ở lại ở phía dưới, nhưng ngay cả sau khi đọc các cuộc thảo luận khác và thử với padding: 0; Tôi không thể khắc phục được. Sau đây là một phần của mã tôi đang sử dụng. Tôi đã xóa một số trường nhập để dễ đọc hơn.
Làm cách nào để khắc phục chân trang cứng đầu?
$(document).ready(function() {
$("a").click(function() {
$('.modal').modal({
show: true
});
return false; //prevent browser defualt behavior
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
<head>
<link data-require="[email protected]*" data-semver="3.2.0" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.js"></script>
<script src="script.js"></script>
</head>
<body>
<a href="#" class="btn btn-info btn-lg">Click me !</a>
<div class="modal fade in" id="editPackageModal" tabindex="-1" role="dialog" aria-labelledby="editPackages" aria-hidden="true">
<div class="modal-dialog" style="overflow-y: auto; max-height: 90vh; height: 80vh;">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">Edit Package MyPackage</h4>
</div>
<div class="modal-body">
<form class="form-horizontal">
<div class="control-group">
<label class="control-label">Package Name:</label>
<div class="controls">
<input type="text" class="form-control" id="package-name" placeholder="MyPackageName">
</div>
</div>
<!-- Other fields here -->
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" id="savePackageChangesBtn">Save changes</button>
</div>
</div>
</div>
</div>
</body>
</html>
Bạn có thể tạo bản trình diễn theo phong cách của mình không? – dfsq
Giống như một câu đố? Không bao giờ được sử dụng, tôi có thể thử: S Bạn có bất cứ đề nghị? –
Tôi khuyên bạn nên Plunkr. Đây là cơ sở cho bạn: http://plnkr.co/edit/EUqJqov3HuAzykIbH9fi?p=preview Như bạn có thể thấy mã của bạn có thể thiếu một số kiểu CSS cụ thể, bởi vì vấn đề không thể sao chép được với chỉ HTML bạn đã đăng. – dfsq