Show button when hovered on another element using only css

As the title suggests, I wanted to show a button when it hovered over a name. And this was the best way that I could do it.

.buttonhidden {
  display: none;
}

.name:hover .buttonhidden {
  display: block;
}

<div class="name">Some Name
  <button class="buttonhidden">Add</button>
</div>