Skip to content

Instantly share code, notes, and snippets.

Chris Coyier chriscoyier

Block or report user

Report or block chriscoyier

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View CSS for <sup> and <sub>
sub, sup {
/* Specified in % so that the sup/sup is the
right size relative to the surrounding text */
font-size: 75%;
/* Zero out the line-height so that it doesn't
interfere with the positioning that follows */
line-height: 0;
/* Where the magic happens: makes all browsers position
@necolas
necolas / snippet.js
Created Jun 14, 2011
Optimised async loading of cross-domain scripts
View snippet.js
/*
* Updated to use the function-based method described in http://www.phpied.com/social-button-bffs/
* Better handling of scripts without supplied ids.
*
* N.B. Be sure to include Google Analytics's _gaq and Facebook's fbAsyncInit prior to this function.
*/
(function(doc, script) {
var js,
fjs = doc.getElementsByTagName(script)[0],
@JohnRiv
JohnRiv / super-css-super-challenge.html
Created Jul 27, 2011
Super CSS Super Challenge Answer
View super-css-super-challenge.html
<!DOCTYPE html>
<html>
<head>
<!--
A solution for the design at http://jsbin.com/super-css-super-challenge
Using no "active" class (but the middle is always "active" in the display).
I think that's how Chris Coyier presented it, but I may have missed the "active" class
-->
<style type="text/css">
body {
@lucasfais
lucasfais / gist:1207002
Created Sep 9, 2011
Sublime Text 2 - Useful Shortcuts
View gist:1207002

Sublime Text 2 – Useful Shortcuts (Mac OS X)

General

⌘T go to file
⌘⌃P go to project
⌘R go to methods
⌃G go to line
⌘KB toggle side bar
⌘⇧P command prompt
@paulirish
paulirish / data-markdown.user.js
Last active Oct 17, 2019
*[data-markdown] - use markdown, sometimes, in your HTML
View data-markdown.user.js
// ==UserScript==
// @name Use Markdown, sometimes, in your HTML.
// @author Paul Irish <http://paulirish.com/>
// @link http://git.io/data-markdown
// @match *
// ==/UserScript==
// If you're not using this as a userscript just delete from this line up. It's cool, homey.
@scottjehl
scottjehl / fixorientationzoom.js
Created Jan 6, 2012
Fix iOS Orientation Change Zoom Bug
View fixorientationzoom.js
/*
NOTE!!!!
The most updated version of this code is here:
https://github.com/scottjehl/iOS-Orientationchange-Fix
@JeffreyWay
JeffreyWay / gist:1608901
Created Jan 13, 2012
Inline Web Workers
View gist:1608901
<!doctype html>
<html>
<head>
<title>Web Workers</title>
</head>
<body>
<script id="worker" type="app/worker">
addEventListener('message', function() {
postMessage('What up, sucka.');
@jimbojsb
jimbojsb / gist:1630790
Created Jan 18, 2012
Code highlighting for Keynote presentations
View gist:1630790

Step 0:

Get Homebrew installed on your mac if you don't already have it

Step 1:

Install highlight. "brew install highlight". (This brings down Lua and Boost as well)

Step 2:

@chriseppstein
chriseppstein / 0_usage.scss
Created Feb 29, 2012
This is code that runs using Sass 3.2 prerelease and something like this will be in compass soon.
View 0_usage.scss
@include keyframes(appear-and-roundify) {
0% { opacity: 0; @include border-radius(2px); }
100% { opacity: 1; @include border-radius(10px); }
}
@jcroft
jcroft / layout.sass
Created Mar 1, 2012
How easy responsive design can be with Sass
View layout.sass
#content-wrapper
+container
#about
// Default (smallest screens)
+column(100%)
background-color: #ccc
// Respond to other screen widths
You can’t perform that action at this time.