Skip to content

Instantly share code, notes, and snippets.

View jayontraps's full-sized avatar

Jason Righelato jayontraps

  • London, UK
View GitHub Profile
<!-- http://t.co/dKP3o1e -->
<meta name="HandheldFriendly" content="True">
<meta name="MobileOptimized" content="320">
<meta name="viewport" content="width=device-width, target-densitydpi=160dpi, initial-scale=1.0">
@jayontraps
jayontraps / HTML: doctype html
Created April 5, 2012 11:04 — forked from chriscoyier/gist:1027728
HTML: doctype html
<!doctype html>
<!--[if lt IE 7 ]> <html class="no-js ie6 ie" lang="en"> <![endif]-->
<!--[if IE 7 ]> <html class="no-js ie7 ie" lang="en"> <![endif]-->
<!--[if IE 8 ]> <html class="no-js ie8 ie" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
.clearfix:after {
content: "";
display: table;
clear: both;
}
@jayontraps
jayontraps / CSS Media Queries
Last active March 2, 2016 20:18
CSS Media Queries
@media screen and (min-width:460px) {
h1 {
color: blue;
}
}
@media screen and (min-width:660px) {
h1 {
color: red;
}
/**
* CSS3 selectors
*/
p:first-child {
color: blue;
}
p:last-child {
color: red;
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
/* clear floats */
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }
.group:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0; }
.group { display: inline-block; clear: both; }
/* start commented backslash hack \*/ * html .group { height: 1%; } .group { display: block; } /* close commented backslash hack */
@jayontraps
jayontraps / HTML: html5shiv
Created July 18, 2012 13:47
html5shiv for old IE
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
@jayontraps
jayontraps / CSS The Media Object
Created September 9, 2012 07:44
CSS The Media Object
/* ====== media ====== */
.media {margin:10px;}
.media, .bd {overflow:hidden; _overflow:visible; zoom:1;}
.media .img {float:left; margin-right: 10px;}
.media .img img{display:block;}
.media .imgExt{float:right; margin-left: 10px;}
/*== http://www.stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/ ==*/
<div class="media attribution">
<a href="http://twitter.com/stubbornella" class="img">
<img src="http://www.tomv2.jayontraps.com/wp-content/gallery/folio30_1/thumbs/thumbs_mindmap.jpg" alt="TOM" />
</a>
<div class="bd">
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas.</p>
<p><a href="#">read more...</a></p>
</div>