Gostaria de saber como posso fazer para que a div conteúdo sempre cresça no máximo para preencher a tela em qualquer resolução ou monitor sem criar barra de rolagem.
Eu quero que tipo o conteúdo tenha como tamanho minimo o tamanho da pagina.
Ele só deve criar barra de rolagem quando o conteúdo da div de conteúdo estiver preenchido o suficiente para isso.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="../Content/bootstrap.css" rel="stylesheet" />
<link href="../Content/Site.css" rel="stylesheet" />
</head>
<body>
<form id="form1" runat="server" class="maximoHeight">
<div class="container maximoHeight">
<div id="cabecalho" class="row">
<div class="col-md-12">
</div>
</div>
<div id="conteudo" class="row">
<div class="col-md-12">
<asp:ContentPlaceHolder ID="cphConteudo" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
<div id="rodape" class="row">
<div class="col-md-12">
</div>
</div>
</div>
</form>
Meu CSS
html, body, .maximoHeight {
height: 100%;
}
#cabecalho {
height:100px;
background-color: red;
}
#conteudo {
min-height: 100%;
background-color: yellow;
}
#rodape {
height: 100px;
background-color: green;
}