在背景积土的边界插页 - CSS

Question

你需要一个css来进行以下模拟

Border inset http://www.freeimagehosting.net/uploads/56ebc14e47.jpg

如何在底部的两端使边框留下10像素，背景填充。

Answer 1

为了使其看起来正确，您需要嵌套div：

.inner {
    margin-right: 10px;
    background: #666;
    border-bottom: 2px solid #000;
    width: 200px; 
    padding-bottom: 10px;
}

.outer {
    width: 200px; 
    border: 10px solid #666; /* your grey fill */
    border-bottom: none;
}

Demonstration

在padding-top元素上混淆padding-bottom和.inner，以获得所需的间距。