Kyle Bavender kbav

( Conversation started here, with @murtaugh and @zeldman. )

Ah man, I got Opinions™ on this. I ususally go with something like:

<aside>
  <h1>Optional Heading</h1>
  <blockquote>
  	<p>It is the unofficial force—the Baker Street irregulars.</p>
	</blockquote>

Make it useful

Install Package Control. For SublimeText 2, paste the following in Terminal:

import urllib2,os; pf='Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler( ))); open( os.path.join( ipp, pf), 'wb' ).write( urllib2.urlopen( 'http://sublime.wbond.net/' +pf.replace( ' ','%20' )).read()); print( 'Please restart Sublime Text to finish installation')

From here on out, use Package Control to install everything. ⌘+Shift+P, then type Install to get a list of installable packages you can 'livesearch through. After installing plugins, they should be running.

	/* Grid */

	html:before, html:after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	pointer-events: none;

	/* change to px if you get a scrollbar */

	/**
	* CSS3 Isometric Text Demo v2
	*/

	@font-face {
	font-family: 'LeagueGothicRegular';
	src: url('http://www.midwinter-dg.com/blog_demos/css-text-shadows/fonts/league_gothic-webfont.eot');
	src: url('http://www.midwinter-dg.com/blog_demos/css-text-shadows/fonts/league_gothic-webfont.eot?iefix') format('eot'),
	url('http://www.midwinter-dg.com/blog_demos/css-text-shadows/fonts/league_gothic-webfont.woff') format('woff'),
	url('http://www.midwinter-dg.com/blog_demos/css-text-shadows/fonts/league_gothic-webfont.ttf') format('truetype'),

	/**
	* I converted the SCSS mixin to LESS for the awesome coders like myself in response to a blog post on 37Signals - http://37signals.com/svn/posts/3271-easy-retina-ready-images-using-scss
	*
	* Update: 2014-08-04 - Updated a long-standing bug where retina images were shown no matter what in the first background-image property.
	* - Updated retina media query to be more reliable ()
	* Update: 2013-11-13 - Picked up another technique thanks to reading this post from Tyler Tate, auto-fill in the second filename for the retina image, http://tylertate.com/blog/2013/06/11/retina-images-using-media-queries-and-LESS-CSS.html
	* Update: 2013-04-16 - Have recently found a few use cases when using a retina pattern from Subtle Patterns on the <body>, this has come in handy
	* Update: 2013-04-05 - Some research in the Wordpress Core(http://core.trac.wordpress.org/ticket/22238#comment:5) was pointed out that some tests may be redundant (Thanks @kbav) so I've cleaned these up
	* Update: 2012-12-29 - U

	jQuery(function($){

	var $flexslider = $('.flexslider'),
	$slides = $flexslider.find('li'),
	stripComment = function(string) {
	return string.replace(/<!--/g, '').replace(/-->/g, '');
	},
	initItem = function(item) {
	var $this = $(item);
	if(!$this.hasClass('init')) {

	.wrapper
	.hovertext Hello World!
	.overlay
	img src="http://ansa.io/sketch.png"
	.mask-wrapper
	.rec1.rec
	.rec2.rec
	.rec3.rec

	// ---------------------------------------------------------------------------------
	// CSS Image Paths
	// ---------------------------------------------------------------------------------
	$bg-img-path: '/path/to/images/'; // Base Path for BG Layout Images

	var tabbableElements = 'a[href], area[href], input:not([disabled]),' +
	'select:not([disabled]), textarea:not([disabled]),' +
	'button:not([disabled]), iframe, object, embed, *[tabindex],' +
	'*[contenteditable]';

	var keepFocus = function (context) {
	var allTabbableElements = context.querySelectorAll(tabbableElements);
	var firstTabbableElement = allTabbableElements[0];
	var lastTabbableElement = allTabbableElements[allTabbableElements.length - 1];