Html CSS，容器高度比预期的要小，有什么修正吗？

我正在从事教育工作，我遇到了一个我真的不知道如何解决的问题。正如您在这里看到的：黄色框比左侧的蓝色边框大得多，我需要蓝色边框与黄色框（邮件示例）一起向下延伸，就像左侧的橙色虚线边框一样。有没有办法用

CSS

和

HTML

解决这个问题？

利用示例容器类的高度就可以解决这个问题。由于您希望它像橙色边框一样一直向下移动，

height:295px工作。

你的代码中有大量错误

同一ID的元素不得超过1个：
#col-2

你给了一个div类
。例如
，然后给了它的子段落一个相同的类，所以你给每个段落一个高度，所以父段落取这个高度，这就是为什么边框没有拉伸，因为这个元素只有
32px的高度

所以

然后给段落另一个类，其高度
32px

您指定了这样的段落

<p class="p example"></p>

您将获得
请检查您的fiddle链接。并在此处发布您的代码。正确的链接是：链接已更新，现在应该可以工作了。我认为您构建HTML的方式存在一个更基本的问题。像空的div和不必要的嵌套之类的东西最终会让你头疼。
.example {
    /* background-image: url(../images/note_bg-line.jpg) repeat-y; */
    background-color: yellow;
}

<p class="p example"></p>

.example p {
        padding-top: 19px;
    padding-left: 70px;
    margin: -19px 0 0 0;
        height:32px;
}