Inserting a border in background padding - CSS

Hi I need CSS for the following layout

Border inset

how to make a frame, leaving 10px at both ends at the bottom, with a background fill.

+2


a source to share


1 answer


To make this look correct, you need a 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 enter padding-top

and padding-bottom

into the element .inner

to get the spacing you want.

0


a source







All Articles