boas pipz,
estou a fazer um projeto e estou com um problema, tenho tudo como quero mas queria a div "extend-menu" sempre fixa no mesmo sitio só que se usar position:fixed ela desaparece e ja tentei de tudo mas nao encontro soluçao.
alguem milagroso por ai ?
se precisarem de fazer scroll insiram mais divs de "information-content"
estou com o bootstrap
HTML:
CSS:
Obrigado
estou a fazer um projeto e estou com um problema, tenho tudo como quero mas queria a div "extend-menu" sempre fixa no mesmo sitio só que se usar position:fixed ela desaparece e ja tentei de tudo mas nao encontro soluçao.
alguem milagroso por ai ?
se precisarem de fazer scroll insiram mais divs de "information-content"
estou com o bootstrap
HTML:
Código:
<div class=".col-xs-12 .col-sm-12 .col-md-12 .col-lg-12" >
<div>
<nav class="navbar navbar-fixed-top navbar-default">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#collapse-menu" aria-expanded="false">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="navbar-brand" >Onseguros</div>
</div>
<div class="collapse navbar-collapse" id="collapse-menu">
<ul class="nav navbar-nav navbar-right links">
<li><a href="">Sair</a></li>
</ul>
</div>
</div>
</nav></div>
<div class="extend-menu"></div>
<div class="main container-fluid ">
<div class="information-content">
Propostas Content;
</div>
<div class="information-content">
Propostas Content;
</div>
<div class="information-content">
Propostas Content;
</div><div class="information-content">
Propostas Content;
</div>
<div class="information-content">
Propostas Content;
</div>
<div class="information-content">
Propostas Content;
</div>
<div class="information-content">
Propostas Content;
</div>
<div class="information-content">
Propostas Content;
</div>
</div>
CSS:
Código:
body{
background-color:#dadfe1;
font-family: 'Roboto Mono' ;
font-size:24px;
}
.navbar-default{
background-color:#446cb3;
margin-top:-1px;
border-radius:0px;
border:none;
}
.navbar-default .navbar-brand{
color: #fff;
font-size:30px;
font-family:'Roboto Mono' ;
font-weight:bold;
}
.navbar-default .navbar-brand:hover{
color: #fff;
font-size:30px;
font-family:'Roboto Mono' ;
font-weight:bold;
}
.navbar .container-fluid {
max-width:1200px;
}
.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus{
color: #fff;
font-size:18px;
font-family:'Roboto Mono' ;
}
.navbar-default .navbar-nav > li > a, .navbar-default .navbar-nav > li > a{
color: #fff;
font-size:18px;
font-family:'Roboto Mono' ;
}
.navbar-default div.navbar-collapse{
border-top:none;
box-shadow:none;
}
.navbar-default .navbar-toggle{
border-color: #446cb3;
}
.navbar-default .navbar-toggle .icon-bar{
background-color:#fff;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus{
background-color: #446cb3;
}
.extend-menu{
height:230px;
background-color:#4183d7;
}
.main{
max-width:1000px;
min-width:380px;
font-size:16px;
font-family:'Roboto Mono' ;
}
.main .information-content{
width:100%;
position: relative;
min-height:100px;
background-color:#fff;
margin-top:-70px;
padding:50px;
margin-bottom:90px;
}
Obrigado