I'd like to have at the top and the bottom of the
<h2>
, a thin border.
Like this:
CSS /* generic h2 */
h2 {
font-size:1.1em;
line-height: 20px;
background-color: #d8713c;
border-radius: 4px;
text-align: center;
color: #fff;
padding: 20px 10px;
position:relative;
}
h2::before, h2::after {
content:"";
position: absolute;
left:50%;
width: 10%; /* anything you like */
margin-left:-5%; /* 50% of width */
height: 0px;
border-bottom: 3px solid #efbe94;
}
h2::before {
top: 7%;
}
h2::after {
bottom: 7%;
}