HTML CSS examples for CSS Widget:Border Style
Make a parentheses like border
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .box<!-- ww w . j a v a2s .c o m--> { height:100px; width:200px; border:10px solid #111; z-index:1; position:relative; } h1 { text-align:center; vertical-align:middle; position:relative; } .box:before { position:absolute; top:-10px; left:10%; content:""; display:block; height:10px; width:80%; background:white; } .box:after { position:absolute; bottom:-10px; left:10%; content:""; display:block; height:10px; width:80%; background:white; } </style> </head> <body> <div class="box"> <h1>ABC</h1> </div> </body> </html>