Border inset on background fill - CSS

Hi need a css for the following mock up

how to make b开发者_运维知识库order leaving 10 px on both ends on bottom,with a background fill.

For this to look right, you'll need nested 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

Just mess with padding-top and padding-bottom on the .inner element to get the spacing you want.