Position div in navbar vertically center and to the right - html

Question

I have a lot of links in a navbar. Most of the links are positioned to the left. I want to position some of the links to the right (right-side-login-cart). The part that is giving me trouble is that I can get the links to the right, but then cannot get the links to vertically align.
I've tried a bunch of different things to get it to work. For instance, I have float:right;, used transform to translate Y, and tried to used vertical align.
Some different attempts:
HTML
<div class="links-at-top">
<div class="links-div">
<a href="/">
<img src="example.com/img">
</a>
Link1
Link2
</div>
<div class="right-side">
<div class="positioning">
<a id="right-link-1">RightLink1</a>
<a id="right-link-2">RightLink2</a>
</div>
</div>
</div>
Attempt 1:
CSS:
.right-side {
padding-right: 50px;
display: inline-block;
}
.positioning {
position: absolute;
right: 0;
transform: translateY(-50%);
}
Attempt 2:
CSS:
.right-side {
padding-right: 50px;
display: inline-block;
}
.positioning {
vertical-align: middle;
}

Answer 1

Add your .right-side div into the same div as your other links so that they'll be on the same line. Then you can just float right.
.links-div {
display: flex;
justify-content: space-between;
align-items: center;
}
<div class="links-at-top">
<div class="links-div">
<div>
Link1
Link2
</div>
<img src="https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_120x44dp.png" alt="" />
<div>
<a id="right-link-1">RightLink1</a>
<a id="right-link-2">RightLink2</a>
</div>
</div>
</div>

Answer 2

You can consider using flex-box
.links-at-top{
display: flex;
justify-content:space-between;
align-items:center;
}
<div class="links-at-top">
<div class="links-div">
Link1
Link2
</div>
<div class="right-side">
<div class="positioning">
<a id="right-link-1">RightLink1</a>
<a id="right-link-2">RightLink2</a>
</div>
</div>
</div>

Answer 3

make .links-div and .right-side both display:inline-block, and float the right-side to right.
<div class="links-at-top">
<div class="links-div">
Link1
Link2
</div>
<div class="right-side">
<ul class="positioning">
<li> <a id="right-link-1">RightLink1</a></li>
<li> <a id="right-link-2">RightLink2</a></li>
</ul>
</div>
.right-side {
display: inline-block;
float:right;
}
.links-div{
display:inline-block;
}