Estou tentando criar um div
na tela inteira que vai servir como um loading
, mas estou tendo um problema pq no <header>
eu tenho um navbar
que defini como navbar-fixed-top
e a div
não cobre esta área do header. Quando eu retiro essa propriedade navbar-fixed-top
funciona, mas o navbar
não fica fixo no topo.
Como faço para que a div
cubra toda a área inclusive o <header>
?
CSS
.div_loading {
position:absolute;
top:0;
left:0;
z-index:11;
background-color:#000;
width:100%;
min-height:100%;
height:auto;
opacity: .50;
filter: alpha(opacity=65);
}
Header(Navbar)
<header>
<div class="navbar navbar-default navbar-fixed-top bg-red" role="navigation">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<h1 class="text-white">MeuSite</h1>
</div>
@Html.Partial("_LoginForm")
</div>
</div>
</header>
Div Loading
<div class="div_loading"></div>