Anchor tag not aligning properly css

Question

I have an div and anchor tag in my html, i have given float left to align them inline to each other. but anchor tag is coming in a new line when the text of the div is in two lines without modifying the html given.

This is what have tried.

CSS:

.relative{
  border: 1px solid #000;
  position: relative;
  margin: 0 auto 20px;
  max-width: 940px;
}
.absolute{
  position: absolute;
  width: 100%;
  z-index: 5;
  border: 1px solid red; 
}
.content {
    margin-bottom: 12px;
    font-size: 14px;
    line-height: 21px;
    color: #333333;
}
.content p {
    float: left;
}
.content a, .content div {
    float: left;
    line-height: 21px;
}
.content div, .content a {
    padding-right: 10px;
}

HTML:

<div class="relative">
  <div class="absolute">
    <div class="content">
      <p><span></span></p>
      <div>Sample Text ##TOTAL_ACTIVITY_INCLUDE_RECENT_VIEW## Sample Text ##TOTAL_ACTIVITY_INCLUDE_RECENT_VIEW## Sample Text ##TOTAL_ACTIVITY_INCLUDE_RECENT_VIEW## Sample Text ##TOTAL_ACTIVITY_INCLUDE_RECENT_VIEW## Sample Text ##TOTAL_ACTIVITY_INCLUDE_RECENT_VIEW##</div>
      <p></p>
      <a href="#" class="">myLink</a>
    </div>
  </div>
</div>

Fiddle

Answer 1

Add display: inline; to .content a and drop float: left;

So you have now:

.content a, .content div {
    display: inline;
}

Expected output:

Check it out.

Answer 2

div{
  display:flex;
}

this will work