jcsrb · April 25, 2012 16:51
diff --git a/dabblet.css b/dabblet.css
 /**
 * Phisicaly size based mediaqueries
 */
 
 body{
 display:block;
 }
 body:after{
 content:'';
 font-size: 4em;
 color: #fff;
 }

 @media only screen and (min-width: 33cm) and (max-width: 34cm) {
 body{
 background-color: lightgreen;
 }
 body:after{
 content: '17inch 4:3 display'
 }
 }

 @media only screen and (min-width: 44cm) and (max-width: 45cm) {
 body{
 background-color: lightblue;
 }
 body:after{
 content: '23inch 16:10 display'
 }
 }


 @media only screen and (min-width: 7.7in) and (max-width: 7.8in) {
 body{
 background-color: #e24f43;
 }
 body:after{
 content: '10" tablet landscap';
 }
 }

 @media only screen and (min-width: 5.7in) and (max-width: 5.9in) {
 body{
 background-color: #e24f43;


 }
 body:after{
 content: '10" tablet portrait';
 }
 }
diff --git a/dabblet.html b/dabblet.html
 <!-- content to be placed inside <body>…</body> -->
diff --git a/settings.json b/settings.json
 {"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}
	/**
	* Phisicaly size based mediaqueries
	*/

	body{
	display:block;
	}
	body:after{
	content:'';
	font-size: 4em;
	color: #fff;
	}

	@media only screen and (min-width: 33cm) and (max-width: 34cm) {
	body{
	background-color: lightgreen;
	}
	body:after{
	content: '17inch 4:3 display'
	}
	}

	@media only screen and (min-width: 44cm) and (max-width: 45cm) {
	body{
	background-color: lightblue;
	}
	body:after{
	content: '23inch 16:10 display'
	}
	}


	@media only screen and (min-width: 7.7in) and (max-width: 7.8in) {
	body{
	background-color: #e24f43;
	}
	body:after{
	content: '10" tablet landscap';
	}
	}

	@media only screen and (min-width: 5.7in) and (max-width: 5.9in) {
	body{
	background-color: #e24f43;


	}
	body:after{
	content: '10" tablet portrait';
	}
	}