Currently working on a new website project utilizing Bootstrap-4
My goal is to position a logo to the left, a link button in the center, and another link button to the right within a footer div. So far, I've managed to achieve the layout, but the issue is that the logo seems to be vertically aligned at its top rather than the center, making it appear lower than expected!
I've made attempts to vertically align it and played around with justify-content properties.
.footer {
background-color: #68B3E2;
text-align: center;
padding: 30px;
justify-content: space-around;
}
.logo {
display:inline-block;
float:left;
}
.center_btn {
display:inline-block;
float:none;
}
.right_btn {
display:inline-block;
float:right;
}<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" rel="stylesheet"/>
<div class="footer">
<img class=logo src="images/logo.png" width="120" height="120" alt="">
<a class="center_btn btn-primary btn-lg" href="#" role="button">Ask a question</a>
<a class="right_btn btn-primary btn-lg" href="#" role="button">Register</a>
</div>