pertrai1

<label for="homeworld">Your home planet</label>
<input type="text" name="homeworld" id="homeworld" list="planets">
<datalist id='planets'>
<option value="Mercury">
<option value="Venus">
<option value="Earth">
<option value="Mars">
<option value="Jupiter">
<option value="Saturn">
<option value="Uranus">

pertrai1

@mixin rounded_corners($tleft, $tright, $bright, $bleft) {
  -moz-border-radius: $tleft $tright $bright $bleft;
  -webkit-border-radius: $tleft $tright $bright $bleft;
  -khtml-border-radius: $tleft $tright $bright $bleft;
  -o-border-radius: $tleft $tright $bright $bleft;
  border-radius: $tleft $tright $bright $bleft;
}

pertrai1

@mixin opacity($opacity) {
  filter: alpha(opacity=#{$opacity});
  opacity: $opacity * 0.01;
}

pertrai1

{
	"files":
	{
		"chromeframe": "http://ajax.googleapis.com/ajax/libs/chrome-frame/1.0.2/CFInstall.min.js",
		"jquery": "http://code.jquery.com/jquery.min.js",
		"modernizr": "http://www.modernizr.com/downloads/modernizr-latest.js",
		"normalize": "https://github.com/necolas/normalize.css/blob/master/normalize.css",
		"prefixfree": "https://raw.github.com/LeaVerou/prefixfree/gh-pages/prefixfree.min.js",
		"reset": "http://meyerweb.com/eric/tools/css/reset/reset.css",
		"shim": "http://html5shim.googlecode.com/svn/trunk/html5.js"

pertrai1

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<!--

This document has been divided up in to the following sections:

	1) CSS3 Properties
	2) Vendor Prefixed Properties
	3) Extras
	4) Standard CSSEdit plist

pertrai1

// Media Queries in Sass 3.2
//
// These mixins make media queries a breeze with Sass.
// The media queries from mobile up until desktop all 
// trigger at different points along the way
//
// And important point to remember is that and width
// over the portrait width is considered to be part of the
// landscape width. This allows us to capture widths of devices
// that might not fit the dimensions exactly. This means the break

pertrai1

@media only screen and (min-width: 320px) {

  /* Small screen, non-retina */

}

@media
only screen and (-webkit-min-device-pixel-ratio: 2)      and (min-width: 320px),
only screen and (   min--moz-device-pixel-ratio: 2)      and (min-width: 320px),
only screen and (     -o-min-device-pixel-ratio: 2/1)    and (min-width: 320px),

pertrai1

<i class="macbook"></i>

pertrai1

iPad

1024 × 690  In landscape on iOS 4.3
1024 × 672  In landscape on iOS 5
768  × 946  In portrait on iOS 4.3 
768  × 928  In portrait on iOS 5
             
1024 × 660  Always showing bookmarks bar in landscape on iOS 4.3
1024 × 644  Always showing bookmarks bar in landscape on iOS 5
768  × 916  Always showing bookmarks bar in portrait on iOS 4.3 

pertrai1

// Listen for orientation changes
window.addEventListener("orientationchange", function() {
    // Announce the new orientation number
    console.log(window.orientation);
    // 0 means portrait, 90 means landscape rotated to the left, -90 means landscape rotated to the right
}, false);