Button with partial border on top and bottom
<p><a href="https://i.stack.imgur.com/E8eT1.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/E8eT1.png" alt="enter image description here"></a></p>

<p>Hi all,
I would like to insert a <code>&lt;button&gt;</code> in my code that has a gap in <code>border-top</code> and <code>border-bottom</code>. I have seen some <a href="https://stackoverflow.com/questions/4131490/any-way-to-limit-border-length">examples</a> where it is possible to remove a part with it, but it's not exactly what I am looking for. Do you have an idea on how to get something like the above mentioned picture?</p>

<p>Thanks in advance for your replies!</p>

<p><strong>EDIT:</strong></p>

<p>I add more information: the best is that the background of the button is transparent and that the <code>border-size</code> is customisable.</p>