Bootstrap 3 modal responsive -
i have modal it's not resizing on smaller screens ( tablets, etc ). there way make responsive ? couldn't find information on bootstrap docs. thanks
i update html code: ( inside django loop )
<div class="modal fade " id="{{ p.id }}" tabindex="-1" role="dialog" aria-labelledby="mymodallabel" aria-hidden="true" > <div class="modal-dialog modal-lg"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> <h4 class="modal-title" id="mymodallabel">producto</h4> </div> <div class="modal-body"> <h5>nombre : {{ p.name}}</h5> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">cerrar</button> </div> </div> </div> </div>
i have css settings:
.modal-lg { max-width: 900px;} @media (min-width: 768px) { .modal-lg { width: 100%; } } @media (min-width: 992px) { .modal-lg { width: 900px; } }
i had same issue have resolved adding media query @screen-xs-min in less version under modals.less
@media (max-width: @screen-xs-min) { .modal-xs { width: @modal-sm; } }
Comments
Post a Comment