My explanation skills are not the best. I have the words "Tasty Burger" stacked on top of each other, but I want them to be on a single line.
.footer-container {
margin: 25px 0;
display: flex;
gap: 3rem;
align-items: center;
justify-content: space-evenly;
}
.footer-item {
text-align: center;
font-size: 1.25rem;
}
<div class="container">
<div class="footer-container">
<div class="footer-item">
<img src="assets/img/logo-footer.png" alt="Tasty Burger Logo" />
<h2>Tasty Burger</h2>
</div>
<div class="footer-item">
<h4>
A burger is more than just a sandwich, it is a wish fulfilled.
</h4>
</div>
</div>
</div>
This is the image. https://i.sstatic.net/w4d65.png
I need it to look like this: https://i.sstatic.net/vXKnb.png
I've been trying different things with flexbox and justify-content, but I feel like I'm heading in the wrong direction.