Modal occupy entire screen

Navigation
4

I have the following Modal and I want it to occupy the entire screen / or most of the screen: 

<div class="modal fade" id="treinamentos" tabindex="-1" role="dialog" aria-labelledby="alterarLabel" style="z-index: 1100;" data-backdrop="static">
    <div class="modal-dialog" role="document">
       <div class="modal-content">
          <div class="modal-header">
              <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
              <h4 class="modal-title" id="exampleModalLabel"><label for="nmTreinamento" id="nmTreinamento"></label></h4>
           </div>
       <div class="modal-body">

       <object width="640" height="390" >
            <param name="movie" id="filme"></param>
            <param name="allowFullScreen" value="true">
            <param name="allowScriptAccess" value="always"></param>
            <embed id="meuid" type="application/x-shockwave-flash" fs=1
            allowfullscreen="true" allowscriptaccess="always"
            width="570" height="480" align="center"></embed>
      </object>
    </div>                
</div>

I have tried to force width: 100% , however, the modal size does not change.

    
asked by anonymous 19.01.2016 / 20:15

1 answer

5

Just change the properties of the modal-dialog and modal-content classes, like this: 

.modal-dialog {
  width: 100%;
  height: 100%;
  padding: 0;
}

.modal-content {
  height: 100%;
  border-radius: 0;
}

JSFiddle

More information: Modal Full Screen

    
19.01.2016 / 20:18
How do I make an application available only on my wireless network? How to extract only different values from an array?