HTML CSS examples for CSS Widget:Arrow
Down Arrow Box with CSS
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> body {<!-- w ww. ja v a 2s . c o m--> margin: 0; padding: 0; } p { margin: 0; padding: 0; } h2 { margin: 0; padding: 0; } #body:after { width: 0; height: 0; border-left: 150px solid transparent; border-right: 150px solid transparent; border-top: 30px solid red; content: ""; display: block; background-color: white; } #body { background-color: red; width:300px; } </style> </head> <body> <div id="body"> <h2>Title</h2> <p>this is text.</p> </div> </body> </html>