HTML CSS examples for CSS Widget:Header
Gradient header 100% width of screen fine
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> body{<!-- w ww . j ava 2s. c o m--> width:100%; } .wrapper { width:100% } div:first-of-type { height:75px; width:100%; background: #7d7e7d; background: -moz-radial-gradient(center, ellipse cover, #7d7e7d 0%, #0e0e0e 100%); background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%, #7d7e7d), color-stop(100%, #0e0e0e)); background: -webkit-radial-gradient(center, ellipse cover, #7d7e7d 0%, #0e0e0e 100%); background: -o-radial-gradient(center, ellipse cover, #7d7e7d 0%, #0e0e0e 100%); background: -ms-radial-gradient(center, ellipse cover, #7d7e7d 0%, #0e0e0e 100%); background: radial-gradient(ellipse at center, #7d7e7d 0%, #0e0e0e 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#7d7e7d', endColorstr='#0e0e0e', GradientType=1); } div:last-of-type { width:600px; height:200px; background-color:#ccc; padding:20px; font-family:Lucida Sans Unicode; } } </style> </head> <body> <div class="wrapper"> <div> </div> </div> <div> This is the content </div> </body> </html>