I have been trying to find a solution for it here, searching, etc, but nothing seems to work. Basically im trying to set the footer using grids in bootstrap but I cant figure it out how to set the class link-footer in the middle height of the div of the footer and the footer-copyright class just to send it to the bottom. Here is the idea: https://prnt.sc/q8abeb
I share with you the code clean:
<footer class="page-footer">
<div class="container-fluid text-center">
<div class="row">
<div class="col-4 col-footer">
<h1>aloha name</h1>
</div>
<div class="col-2 link-footer">
<a href="#" class="text-uppercase">home</a>
</div>
<div class="col-2 link-footer">
<a href="#" class="text-uppercase">about me</a>
</div>
<div class="col-2 link-footer">
<a href="#" class="text-uppercase">projects</a>
</div>
<div class="col-2 link-footer">
<a href="#" class="text-uppercase">contact</a>
</div>
</div>
</div>
<div class="footer-copyright text-center">© 2020 Copyright:
<span>aloha</span>
</div>
</footer>
I add the CSS but is not too much actually
footer {
background-color: #545454;
height: 200px;
}
.col-footer h1 {
text-transform: uppercase;
font-family: 'Montserrat', sans-serif;
font-weight: 800;
font-size:2em;
color:white;
}
.link-footer a {
font-size:1em;
color:white;
font-weight: 600;
text-decoration: none;
}
.link-footer a:hover {
color:#4860FF;
}
.footer-copyright {
background-color: #3b3b3b;
color: #838383;
}
.footer-copyright span{
color: white;
}
I have tried adding margin, bottom, py, my, my-auto, etc and nothing works. Any idea??