如何在透明背景下围绕页面上的图标和其他元素创建可调整大小(甚至设置宽度)的边框,如下所示?


------[element]------
Run Code Online (Sandbox Code Playgroud)
目前最好的思路是
<div class="outer"> Border left / right
outer:before - Border top/ bottom; width:10%
Element
outer:after- Border top/ bottom; width:10%
</div>
Run Code Online (Sandbox Code Playgroud)
但是我如何合并包围整个中间部分的水平线以太侧