HTML CSS examples for CSS Widget:Border Style
Create Css inner border
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .my {<!-- ww w . j a v a2s . co m--> position:relative; background: #166270; height: 65px; width:53%; -moz-border-radius-bottomtop: 50px; border-top-right-radius: 50px; } .my_verde { background: none repeat scroll 0 0 #72C267; height: 65px; position: relative; width: 100%; color: #FFFFFF; } .my_verde:after{ content:''; background:inherit; height:10px; display:block; width:47%; position:absolute; right:0; } .my h1 { color: #FFFFFF; font-family:'myriadpro-light'; font-size: 34px; margin: -10px 0 0; text-align: center; } img{ width:100%; height:auto; } </style> </head> <body> <div class="my_verde"> <header class="my"> <div class="page-header"> <div class="container"> <div class="col-12 col-offset-1 col-lg-10 col-lg-offset-1"> Some text </div> </div> </div> </header> </div> <img src="https://www.java2s.com/style/demo/Safari.png"> </body> </html>