csssecrets · January 17, 2023 16:27
diff --git a/dabblet.css b/dabblet.css
 /**
 * Parallelograms — with extra HTML element
 */
 
 .button { transform: skewX(45deg); }
 .button > div { transform: skewX(-45deg); }

 .button {
 	display: inline-block;
 	padding: .5em 1em;
 	border: 0; margin: .5em;
 	background: #58a;
 	color: white;
 	text-transform: uppercase;
 	text-decoration: none;
 	font: bold 200%/1 sans-serif;
 }
diff --git a/dabblet.html b/dabblet.html
 <a href="#yolo" class="button"><div>Click me</div></a>
 <button class="button"><div>Click me</div></button>
diff --git a/dabblet.js b/dabblet.js
 // alert('Hello world!');
diff --git a/settings.json b/settings.json
 {"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
	/**
	* Parallelograms — with extra HTML element
	*/

	.button { transform: skewX(45deg); }
	.button > div { transform: skewX(-45deg); }

	.button {
	display: inline-block;
	padding: .5em 1em;
	border: 0; margin: .5em;
	background: #58a;
	color: white;
	text-transform: uppercase;
	text-decoration: none;
	font: bold 200%/1 sans-serif;
	}
	<a href="#yolo" class="button"><div>Click me</div></a>
	<button class="button"><div>Click me</div></button>