I'm creating a new blog platform and I need some advice on how to properly position the blog post div in relation to the date div so it displays with the appropriate gaps. https://i.stack.imgur.com/oLbCq.jpg
https://i.stack.imgur.com/CqV7b.png
Here's the code snippet I currently have:
<div class="container post">
<div class="date">
<h3>20</h3>
<h5>november</h5>
</div>
Lorem ipsum dolor sit amet
</div>
.post{
margin-top: 40px;
padding: 10px;
color: white;
background: black;
border: 3px white solid;
box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
position: relative;
}
.date {
position: absolute;
border: 2px white solid;
width: 55px;
height: 50px;
left: -40px;
background: black;
}
.date h3{
position: relative;
top: -18px;
left: 11px;
}
.date h5{
position: relative;
top: -28px;
left: 2px;
}
If you could offer any assistance on this matter, specifically how to ensure the blog post aligns correctly with the date div, that would be greatly appreciated.