css - how to regulate a form like inherit

Question

<ul>
<li><a href="{{ route('dashboard') }}">Panel</a></li>  
<li><a href="{{ route('contact') }}">Contact</a></li>
<li><form style="display: inline;" method="POST" action="{{ route('logout') }}">
  <button type="submit">Logout</button>
 @csrf
</form></li>
</ul>

This is my codes. But it seems like below:

How can i do like this:

If i use button and form instead of a it's not tidy. If you help me i will be glad.

Answer 1

You can use margin-top. For example :

margin-top: 5px;