Задаю контенту фиксированную высоту, но все равно он под футером. Вы не знаете, лучше оставить высоту футера auto?
<main class="project">
<div class="blog-container">
<div class="blog-header">
<div class="blog-cover">
</div>
</div>
<div class="blog-body">
<div class="blog-title">
<h1><a href="#">Lorem ipsum dolor sit amet</a></h1>
</div>
<div class="blog-text"><p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Neque sapiente quae enim eius sit ratione doloremque, non quo, quaerat soluta sint aspernatur nostrum doloribus dolor perferendis saepe numquam molestiae rerum. Iusto explicabo molestias cumque expedita officia repellendus excepturi vitae iure.</p>
</div>
<div class="blog-tags">
<ul>
<li><a href="#">Lorem</a></li>
<li><a href="#">ipsum</a></li>
<li><a href="#">dolar</a></li>
<li><a href="#">consectetur</a></li>
</ul>
</div>
</div>
<div class="blog-footer">
<ul>
<li class="published-date">4 days ago</li>
</ul>
</div>
</div>
</main>
<footer>
<nav>
<a href="index.html">HOME</a>
<a href="projects.html">PROJECTS</a>
<a href="blog.html">BLOG</a>
<a href="contact.html">CONTACT</a>
<a href="about.html">ABOUT</a>
<a href="services.html">SEVICES</a>
<a href="location.html">LOCATION</a>
</nav>
<div class="logo">
<a href="index.html"><img class="graphiclogo" src="logo.png" alt="logo"></a>
</div>
<div class="social">
<a href="#"><img src="img/social/em.png" alt="em"></a>
<a href="#"><img src="img/social/face.png" alt="em"></a>
<a href="#"><img src="img/social/goo.png" alt="em"></a>
<a href="#"><img src="img/social/inst.png" alt="em"></a>
<a href="#"><img src="img/social/pint.png" alt="em"></a>
</div>
<p>Version 2019</p>
</footer>
<script src="js/script.js"></script>
</body>
.blog-container {
background: #fafafa;
border-radius: 5px;
box-shadow: rgba(0,0,0,0.2) 0 4px 2px -2px;
font-weight: 100;
margin: 48px auto;
margin-bottom: 100px;
width: 50rem;
height: 20px;
}
footer {
width: 100%;
height: auto;
background: black;
margin: 0 auto;
text-align: center;
padding-top: 25px;
position:absolute;
bottom:0
}