schadeck
schadeck
/ dabblet.css
Created
March 14, 2012 14:07
— forked from secondfret/dabblet.css
Design Shack Respnsive Menu
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Design Shack Respnsive Menu | |
| */ | |
| * { | |
| padding: 0; | |
| margin: 0; | |
| -webkit-box-sizing: border-box; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| body { | |
| font-family: sans-serif; | |
| } | |
| ul { | |
| list-style: none | |
| } | |
| li { | |
| background: slategrey; |
schadeck
/ check.html
Created
April 30, 2012 14:19
— forked from andrewrocco/check.html
CSS Media Check
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!doctype html> | |
| <html> | |
| <head> | |
| <title>CSS Media Check</title> | |
| <style type="text/css"> | |
| #mediaquery{ | |
| -webkit-transition: width .001s; | |
| -moz-transition: width .001s; |
schadeck
/ dabblet.css
Created
July 10, 2012 03:39
— forked from dstorey/dabblet.css
set the size of the boxes and any decoration
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .slider { | |
| /* set initial width */ | |
| width: 520px; | |
| /* hide the content that overflows (to allow second box to show through) */ | |
| overflow: hidden; | |
| display: inline-block; | |
| /* skew container so that it has angled edge, and set up transition */ | |
| transform: skewX(-20deg); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * demo to explain chained transforms | |
| */ | |
| * { margin: 0; } | |
| .wrap, .wrap * { display: block; width: 4em; height: 4em; } | |
| .wrap { outline: dashed 1px dodgerblue; margin: 13em auto 0; } | |
| .deg45 { | |
| position: absolute; | |
| animation: ani 8s infinite; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Circular Tooltip (SO) | |
| * http://stackoverflow.com/q/13132864/1397351 | |
| */ | |
| * { margin: 0; padding: 0; } | |
| body { | |
| overflow: hidden; | |
| background: url(http://theearlcarlson.com/experiments/amTooltip/img/bg.jpg); | |
| } | |
| /* generic styles for button & circular menu */ |
schadeck
/ dabblet.css
Created
July 29, 2013 14:21
— forked from LeaVerou/dabblet.css
Loading animation like the one seen on http://www.freeger.com/projects/contextad/ with CSS
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Loading animation like the one seen on http://www.freeger.com/projects/contextad/ with CSS | |
| * Caveat: Not DRY. The content needs to be repeated in a data- attribute (or directly in the CSS). | |
| */ | |
| body { | |
| background: #ccc51c; | |
| min-height: 100%; | |
| } |
schadeck
/ dabblet.css
Created
October 7, 2013 17:20
— forked from LeaVerou/dabblet.css
Easy trapezoids with 3D transforms
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Easy trapezoids with 3D transforms | |
| */ | |
| p { | |
| position: relative; | |
| display: inline-block; | |
| padding: 1em; | |
| margin: 2em; | |
| } |
schadeck
/ dabblet.css
Created
October 21, 2013 14:39
— forked from LeaVerou/dabblet.css
Slanted tabs with CSS 3D transforms
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Slanted tabs with CSS 3D transforms | |
| * See http://lea.verou.me/2013/10/slanted-tabs-with-css-3d-transforms/ | |
| */ | |
| body { padding: 50px; } | |
| nav { | |
| position: relative; | |
| z-index: 1; |
schadeck
/ dabblet.css
Created
October 21, 2013 14:42
— forked from LeaVerou/dabblet.css
Easy trapezoids with 3D transforms
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * Easy trapezoids with 3D transforms | |
| */ | |
| p { | |
| position: relative; | |
| display: inline-block; | |
| padding: 1em; | |
| margin: 2em; | |
| } |
OlderNewer