块元素内span设置padding

当块元素不设置高度，子span元素设置padding时，高度会溢出块元素。

     <style>
        .spancontainer {
            background-color: #c3e7d5;

        }
        span {
            padding: 10px;
            font-size: 20px;
            background-color: bisque;
        }


    </style>
    <p style=" border: rgb(196, 76, 76) 1px solid;">
       <span class="spancontainer">a
        </span>
    </p>

行内元素设置padding

行内元素使用内联盒子，设置的padding，margin对垂直方向上的块级盒子或内联盒子不生效。但是对内部文字还是会生效。所以此时a坐在的span垂直方向上的高度计算是:a所占的像素+padding > p.width
但是为什么没有把p元素撑开而是溢出了?
因为内联盒子padding不会把垂直其他元素推开，不影响布局，只影响显示。