5

Tenho a seguinte Modal e quero que ela ocupe a tela inteira / ou maior parte da tela:

<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>

Já tentei forçar o width:100%, entretanto o tamanho da modal não é alterado.

1 Resposta 1

5

Basta alterar as propriedades das classes modal-dialog e modal-content, desta forma:

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

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

JSFiddle

Mais informações: Modal Full Screen

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .