background-clip: padding-box;That’s it
Support: IE9+

background-clip的值
padding-box： 从padding区域（不含padding）开始向外裁剪背景。 
border-box： 从border区域（不含border）开始向外裁剪背景。 
content-box： 从content区域开始向外裁剪背景

Use outline instead of border:

outline: 10px solid RGBA(0, 0, 0, 0.03);
background-color: #A5DC86;

Can you just set the border color to be the same as the background color?

The background color area set by background-color includes border and padding, so if the set border is dotted or has transparency, you can see the set background color through the border
Set the outline style mentioned by @He Xiansen, You can set an outer border style outside the border of the target element, with the starting position being the border of the target element. This style does not affect the current layout of the target element, which can cause some problems, such as

<style>
  .p_outline{
            width: 100px;
            height: 100px;
            background-color: #ffe48d;
            outline:dotted 10px red;
            /*border: solid 10px rgba(249, 249, 249, 0.2);*/
        }
        .p_border{
            width: 100px;
            height: 100px;
            background-color: #00a23f;
            border: dotted 10px rgba(249, 249, 249, 0.2);
        }
</style>
<p class="p_outline">
</p> 
<p class="p_outline">
</p> 

We will see that outline will occupy the position of other elements

To solve this problem, we can solve it by setting margin:

  .p_outline{
        width: 100px;
        height: 100px;
        margin: 10px 10px 10px 10px;
        background-color: #ffe48d;
        outline:dotted 10px red;
        /*border: solid 10px rgba(249, 249, 249, 0.2);*/
    }

Strange, why does the background color fill in the border color? I didn't understand it when I was reviewing the question.

Don’t you know the padding for the background color? ?

What a strange question, and the answer is also confusing