Chris Mousdale Chrisedmo
This file contains hidden or 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
| /** | |
| * CSS3 Grid (via gradients) | |
| */ | |
| background-color: #fff; | |
| background-image: | |
| linear-gradient(#eee .05em, transparent .05em); | |
| background-size: 100% 2em; /*change this for grid height */ |
Chrisedmo
/ dabblet.css
Created
January 10, 2012 19:57
Experimenting with a side scroll for mobile nav
This file contains hidden or 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
| /** | |
| * Experimenting with a side scroll for mobile nav | |
| */ | |
| topscroll { | |
| display: none; | |
| } | |
| ul { | |
| width: 1000px; |
This file contains hidden or 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
| /* CSS3 Grid generator */ | |
| /* Change background size to change grid size */ | |
| background-image: | |
| -webkit-linear-gradient(gray 1px, transparent 1px), | |
| -webkit-linear-gradient(0, gray 1px, transparent 1px); | |
| background-size:2.2rem 2.2rem, 2.2rem 2.2rem; | |
| background-position:-1px -1px, -1px -1px |
Chrisedmo
/ dabblet.css
Created
January 12, 2012 17:34
— forked from desandro/dabblet.css
Nice way to scale and show predefined images / ads etc
This file contains hidden or 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
| /** | |
| * Nice way to scale and show predefined images / ads etc | |
| */ | |
| ul { | |
| border: 3px dotted; | |
| list-style: none; | |
| margin: 0; | |
| padding: 0; | |
| display: -webkit-box; |
Chrisedmo
/ LESS Placeholder Image Fetcher variable
Created
April 18, 2012 10:48
Placeholder Image Fetcher Function by: Anders Schmidt Hansen
This file contains hidden or 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
| .placeholder-500 { | |
| display: block; | |
| .placeholdit(500,300); // Magic! | |
| .size(500,300); | |
| } | |
| // Call a Placehold.it image | |
| .placeholdit(@width: 300, @height: 210) { | |
| @placeholdIt: ~`"http://placehold.it/@{width}x@{height}"`; | |
| background: url(@placeholdIt) no-repeat; |
Chrisedmo
/ CSS3 Media Query reporter
Created
April 18, 2012 10:50
CSS3 Media Query reporter - add to CSS.
This file contains hidden or 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:after { | |
| content: "less than 320px"; | |
| font-size: 300%; | |
| font-weight: bold; | |
| position: fixed; | |
| bottom: 60px; | |
| width: 100%; | |
| text-align: center; | |
| background-color: hsla(1,60%,40%,0.7); | |
| color: #fff; |
This file contains hidden or 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
| /** | |
| * Circle Hover / expand boxes | |
| */ | |
| ul {list-style: none; margin:50px; padding: 0;} | |
| li {height: 200px; display: block; width: 200px; float: left; text-align: center; | |
| background-color: #eee; margin-left: -20px; | |
| border-radius: 50%} | |
| li:nth-child(1) {background-color: #ddd;} |
This file contains hidden or 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
| /** | |
| * webkit filter on text!? | |
| */ | |
| body { | |
| padding: 50px; | |
| font-family: 'Helvetica Neue', helvetica, arial; | |
| } | |
| h1 { | |
| font-size: 55px; |
This file contains hidden or 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> | |
| <script class="jsbin" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> | |
| <meta charset=utf-8> | |
| <meta name="viewport" content="width=device-width, initial-scale=1"> | |
| <title>JS Bin</title> | |
| <style> | |
| body { |
This file contains hidden or 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
| /* reset webkit search input browser style */ | |
| input { | |
| outline: none; | |
| } | |
| input[type=search] { | |
| -webkit-appearance: textfield; | |
| -webkit-box-sizing: content-box; | |
| font-family: inherit; | |
| font-size: 100%; | |
| } |
OlderNewer