Anselm Hannemann anselmh
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <div> | |
| <h1>Test</h1> | |
| <p>text inside this here.</p> | |
| </div> | |
| <footer class="pattern"> | |
| <p>text inside this here.</p> | |
| </footer> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- content to be placed inside <body>…</body> --> | |
| <div class="ym-wrapper"> | |
| <div class="ym-wbox ym-clearfix"> | |
| <h1>flexible fluid <figure></h1> | |
| <figure class="float-left"> | |
| <img src="http://farm1.staticflickr.com/113/312754502_a1c6ac91e0_m.jpg" title="" alt="" /> | |
| <figcaption> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| css only show/hide | |
| */ | |
| html { | |
| background: white url(http://genelocklin.com/examples/shared-images/texture/generated.png) 0 0 repeat; } | |
| * { |
anselmh
/ dabblet.css
Created
February 7, 2012 11:54
The first commented line is your dabblet’s title
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * The first commented line is your dabblet’s title | |
| */ | |
| body{ | |
| background: #fff; | |
| min-height:100%; | |
| } | |
| p{ | |
| position: relative; | |
| background: #000000; |
anselmh
/ imgtag.html
Created
January 24, 2012 08:53
— forked from ike/imgtag.html
The New Img Tag (evolved)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <img src="large-default-file.jpg" media="screen and (min-width:601px)" alt="this is alternative text for default file" title="this is title for default file"> | |
| <source src="smaller.jpg" media="screen and (max-device-width:600px)" alt="this is alternative text for smaller file" title="this is title for smaller file"> | |
| <source src="tiny.jpg" media="screen and (max-device-width:320px)" alt="this is alternative text for tiny file" title="this is title for tiny file"> | |
| <source src="monochrome.jpg" media="monochrome" alt="this is alternative text for monochrome file" title="this is title for monochrome file"> | |
| </img> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * circled-font | |
| */ | |
| /* currently it's an ellipse not a circle */ | |
| .iconstyle { | |
| background: #000; | |
| color: #B4E3FF; | |
| border-radius: 50%; | |
| padding: .6em; |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #id{ | |
| background: #999; | |
| position: fixed; | |
| top:0; | |
| width: 100%; | |
| height: 10em; | |
| z-index: 99999999999999; | |
| padding-top:4em; | |
| -webkit-transition: all linear 1s; | |
| -moz-transition: all linear 1s; |
anselmh
/ dabblet.css
Created
January 7, 2012 22:21
The first commented line is your dabblet’s title
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * The first commented line is your dabblet’s title | |
| */ | |
| body{ | |
| background: #CCC; | |
| padding: 500px; | |
| } | |
| #map_de_muc { |
anselmh
/ responsive-attr-html5.html
Last active
September 26, 2015 21:07
responsive attribute for HTML/CSS3
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!-- backwards compatible solution --> | |
| <!-- the browser should read media-query and then download the right file for the actual screen size --> | |
| <img media-xs="(min-width:640px)" media-xs-src="http://cdn.url.com/img/myimage_xs.jpg" media-m="(max-width:1024px)" media-m-src="http://cdn.url.com/img/myimage_m.jpg" media-xl="(min-width:1025px)" media-xl-src="http://cdn.url.com/img/myimage_xsl.jpg" src="http://cdn.url.com/img/myimage_xs.jpg" /> | |
| <img media-xs="(max-width:640px)" | |
| media-xs-src="http://cdn.url.com/img/myimage_xs.jpg" | |
| media-m="(max-width:1024px)" | |
| media-m-src="http://cdn.url.com/img/myimage_m.jpg" | |
| media-xl="(min-width:1025px)" | |
| media-xl-src="http://cdn.url.com/img/myimage_xsl.jpg" |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // if you have analytics, set them in pagevisibility mode to get real-user-trackig according to prerender-issues in Chrome/WebKit. | |
| var viewCounted = false; | |
| function handleVisibilityChange(evt) { | |
| //Only count the view once we're done prerendering AND the document is done loading | |
| if (document.webkitVisibilityState == 'prerender' | |
| || document.readyState != 'complete' || viewCounted) | |
| return; | |
| /* Implementation of view counting system starts here */ | |
| // Code for Google Analytics | Change UA-XXXXX-X to be your site's ID |