nakome
3/7/2013 - 4:27 PM

The first commented line is your dabblet’s title

The first commented line is your dabblet’s title

settings.json
content_copyfile_download
{"view":"split","fontsize":"110","seethrough":"","prefixfree":"1","page":"css"}
dabblet.html
content_copyfile_download
<!-- content to be placed inside <body>…</body> -->

<div class="circle"><h1>Hello world</h1></div>
dabblet.css
content_copyfile_download
/**
 * The first commented line is your dabblet’s title
 */
body{
	background: #f06;
	background: linear-gradient(top left, #f06, #fd0);
	min-height: 100%;
}
.circle{
	position:absolute;
	top:20%;
	left:35%;
	padding:5px;
	width:400px;
	height:250px;
	background: linear-gradient(bottom left, #f4d , #f8d);
	border:10px dashed #f0d;
	border-radius:4px;
	box-shadow:inset 1px 4px 3px #f03,inset 1px 5px 5px black,0 2px 3px #f00, 0 4px 3px #333, 0 2px 10px #000;
}
.circle h1{
	font-size:60px;
	font-weight:bold;
	text-align:center;
	margin-top:80px;
	color:white;
	text-shadow:0 2px 3px #ddd,0 3px 3px #300,0 4px 6px #d00;
}