Ralph Hansell ralgh

## dabblet.css


.container{
/* Just a container to set the width and positioning of tabs block */
margin:2em auto 0;
position:relative;
width:80%;
}
.reset{

## dabblet.css
.container{
/* Just a container to set the width and positioning of tabs block */
margin:2em auto 0;
position:relative;
width:80%;
}
.reset{
/* just the reset link. Nothing to see here */
background:pink;
display: inline-block;

## dabblet.css
/**
 * test 1
 */

        .query{
            display: inline-block;
            height: 10px;
            padding:0;
        }
        .col1{

## dabblet.css
/**
 * CSS Arrow icons
 */

.widget {
	overflow: hidden;
	position:relative;
	text-indent: -999em; /* hide text from view */
}
.widget:before,

## breakpoints_via_css.html
<!DOCTYPE html>
<!--[if IE 8]>    <html lang="sv-SE" class="no-js ie8"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="sv-SE" class="no-js"> <!--<![endif]-->
<head>
    <meta charset="UTF-8">
    <title>Breakpoint detection test</title>
    <style type="text/css" media="screen">
        @media screen and (min-width: 320px) {
            #page:after {
                content: 'smallest'; /* represent the current width-bracket */

## block.tpl.php
<?php

/**
 * @file
 * Default theme implementation to display a block.
 *
 * Available variables:
 * - $block->subject: Block title.
 * - $content: Block content.
 * - $block->module: Module that generated the block.

## _respond-to.scss
// sass 3.2 or higher required
@mixin respond-to($min-width, $max-width: null) {
  $fix-mqs: false !default;

  // If we're outputting for a fixed media query set...
  @if $fix-mqs {
    // ...and if we should apply these rules...
    @if $max-width != null {
      @if (($fix-mqs >= $min-width) and ($fix-mqs <= $max-width)) {
        // ...output the content the user gave us.

## dabblet.css
/**
 * testing units
 */
body{
	text-align: center;
}
#box{
	background-color: red;
	display: inline-block;
	width: 200px;

## 2013-01-13T23:18:38.091Z
Testing 123


## gist:4532090
<!DOCTYPE html>
<html lang="en">
  <head>
  <title>Tiny data-uri image strings</title>
  <style>
  .image-sample{
  border: 1px solid;
  }
  </style>
  </head>



	.container{
	/* Just a container to set the width and positioning of tabs block */
	margin:2em auto 0;
	position:relative;
	width:80%;
	}
	.reset{
	/**
	* test 1
	*/

	.query{
	display: inline-block;
	height: 10px;
	padding:0;
	}
	.col1{
	/**
	* CSS Arrow icons
	*/

	.widget {
	overflow: hidden;
	position:relative;
	text-indent: -999em; /* hide text from view */
	}
	.widget:before,
	<!DOCTYPE html>
	<!--[if IE 8]> <html lang="sv-SE" class="no-js ie8"> <![endif]-->
	<!--[if gt IE 8]><!--> <html lang="sv-SE" class="no-js"> <!--<![endif]-->
	<head>
	<meta charset="UTF-8">
	<title>Breakpoint detection test</title>
	<style type="text/css" media="screen">
	@media screen and (min-width: 320px) {
	#page:after {
	content: 'smallest'; /* represent the current width-bracket */
	<?php

	/**
	* @file
	* Default theme implementation to display a block.
	*
	* Available variables:
	* - $block->subject: Block title.
	* - $content: Block content.
	* - $block->module: Module that generated the block.
	// sass 3.2 or higher required
	@mixin respond-to($min-width, $max-width: null) {
	$fix-mqs: false !default;

	// If we're outputting for a fixed media query set...
	@if $fix-mqs {
	// ...and if we should apply these rules...
	@if $max-width != null {
	@if (($fix-mqs >= $min-width) and ($fix-mqs <= $max-width)) {
	// ...output the content the user gave us.
	/**
	* testing units
	*/
	body{
	text-align: center;
	}
	#box{
	background-color: red;
	display: inline-block;
	width: 200px;
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<title>Tiny data-uri image strings</title>
	<style>
	.image-sample{
	border: 1px solid;
	}
	</style>
	</head>