0
I got the following HTML:
<body>
<div class="todo">
<button class='button'>Login</button>
<div class="topo">
<h1 class="h1Centralizado">
<?php echo $constantes->getTituloSite(); ?>
</h1>
</div>
<div class="cont">
<?php require_once("indexConteudo.php"); ?>
</div>
<div class="final">
<?php require_once("celula/_requeridos/final.php"); ?>
</div>
</div>
</body>
And the next CSS:
html, body, .todo {
min-height:100%
}
html {
font-family: 'Open Sans';
font-size: 1em;
background-image: radial-gradient(rgb(172,204,193) 20%, rgb(40, 22, 111));
background-size: cover;
background-repeat: no-repeat;
box-sizing: content-box;
}
The goal is to get the div.rodape always be the final of page.
However, when the content of the page does not fill the whole page I have a problem because the div.rodape is up there as in image down below:
How to make that in any situation, the div.rodape always be on end of page?
This error can be seen in
Obs.: I wouldn’t like to use position: fixed and neither position: absolute because of the fixed position this generates.
@hugocsl, please, this question is NOT duplicate as it does not allow display: flex as solution. Please uncheck it as duplicate.
– Carlos Rocha
.cont { min-height: Calc(100vh - 120px); }
– Carlos Rocha
Carlos added another Duplicate that meets his criteria. https://answall.com/a/86214/97477
– hugocsl
so, thanks, in my attempts I did something like this. did: at last Did margin-bottom: 0; and position: relative; and html, body, { min-height:100% }
– Carlos Rocha