Question

帮助！我已经阅读了这里的每一个问题和在线的每个教程......但我似乎无法使我的布局上出现左右列的底部边框，我正试图将它放在一起。

Here is a link我正在处理它。

谁能告诉我我做错了什么？

我目前的css是：

.main-inner .fauxcolumn-left-outer .fauxcolumn-inner {
    margin-right: 20px;
    background: white url(http://i1109.photobucket.com/albums/h423/thesinglemomoirs/templates/pinkcupcake/38d73024.png) repeat scroll top left;
    border: 2px solid black;
}
.fauxcolumn-outer .fauxborder-left, .fauxcolumn-outer .fauxborder-right, .fauxcolumn-inner {
    height: 100%;
}

Answer 1

您的问题的解决方案是设置框尺寸，如下所示：

.fauxcolumn-inner {
    box-sizing: border-box;
}

您的问题是，当您将高度设置为100％时，没有框大小调整到边框：

.fauxcolumn-outer .fauxborder-left,
.fauxcolumn-outer .fauxborder-right,
.fauxcolumn-inner {
    height: 100%
}

然后添加边距，填充或边框，您的真实高度最终会超过100％

Answer 2

.yourclass {
    border-bottom:thick solid black;
}

Answer 3

你可以用没有模糊的内框阴影替换边框：

box-shadow: inset 0 0 0 2px #000000;

CSS底部边框不出现在左右列中

3 个答案: