ddprrt/dabblet.css

## dabblet.css
/* IE8 CSS only Accordion */
a.accord ~ div.container {
	height: 0px;
	overflow: hidden;
	-webkit-transition: all 0.3s ease;
	   -moz-transition: all 0.3s ease;
	    -ms-transition: all 0.3s ease;
	     -o-transition: all 0.3s ease;
}

a.accord:active ~ div.container {
	height: auto;
}

## dabblet.html
<!-- content to be placed inside <body>…</body> -->
<a href="#part1" class="accord"><h3 id="part1">Part 1</h3></a>
<div class="container">
Really don't mind if you sit this one out.<br/>
My words but a whisper -- your deafness a SHOUT.<br/>
I may make you feel but I can't make you think.<br/>
Your sperm's in the gutter -- your love's in the sink.<br/>
So you ride yourselves over the fields and<br/>
you make all your animal deals and<br/>
your wise men don't know how it feels to be thick as a brick.<br/>
And the sand-castle virtues are all swept away in<br/>
the tidal destruction<br/>
the moral melee.<br/>
The elastic retreat rings the close of play as the last wave uncovers<br/>
the newfangled way.<br/>
But your new shoes are worn at the heels and<br/>
your suntan does rapidly peel and<br/>
your wise men don't know how it feels to be thick as a brick.<br/>
</div>


<a href="#part3" class="accord"><h3 id="part3">Part 3</h3></a>
<div class="container">
Really don't mind if you sit this one out.<br/>
My words but a whisper -- your deafness a SHOUT.<br/>
I may make you feel but I can't make you think.<br/>
Your sperm's in the gutter -- your love's in the sink.<br/>
So you ride yourselves over the fields and<br/>
you make all your animal deals and<br/>
your wise men don't know how it feels to be thick as a brick.<br/>
And the sand-castle virtues are all swept away in<br/>
the tidal destruction<br/>
the moral melee.<br/>
The elastic retreat rings the close of play as the last wave uncovers<br/>
the newfangled way.<br/>
But your new shoes are worn at the heels and<br/>
your suntan does rapidly peel and<br/>
your wise men don't know how it feels to be thick as a brick.<br/>
</div>
<a href="#part2" class="accord"><h3 id="part2">Part 2</h3></a>
<div class="container">
Really don't mind if you sit this one out.<br/>
My words but a whisper -- your deafness a SHOUT.<br/>
I may make you feel but I can't make you think.<br/>
Your sperm's in the gutter -- your love's in the sink.<br/>
So you ride yourselves over the fields and<br/>
you make all your animal deals and<br/>
your wise men don't know how it feels to be thick as a brick.<br/>
And the sand-castle virtues are all swept away in<br/>
the tidal destruction<br/>
the moral melee.<br/>
The elastic retreat rings the close of play as the last wave uncovers<br/>
the newfangled way.<br/>
But your new shoes are worn at the heels and<br/>
your suntan does rapidly peel and<br/>
your wise men don't know how it feels to be thick as a brick.<br/>
</div>


## settings.json
{"view":"split","seethrough":"","prefixfree":"1","page":"all"}
	/* IE8 CSS only Accordion */
	a.accord ~ div.container {
	height: 0px;
	overflow: hidden;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-ms-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	}

	a.accord:active ~ div.container {
	height: auto;
	}
	<!-- content to be placed inside <body>…</body> -->
	<a href="#part1" class="accord"><h3 id="part1">Part 1</h3></a>
	<div class="container">
	Really don't mind if you sit this one out.<br/>
	My words but a whisper -- your deafness a SHOUT.<br/>
	I may make you feel but I can't make you think.<br/>
	Your sperm's in the gutter -- your love's in the sink.<br/>
	So you ride yourselves over the fields and<br/>
	you make all your animal deals and<br/>
	your wise men don't know how it feels to be thick as a brick.<br/>
	And the sand-castle virtues are all swept away in<br/>
	the tidal destruction<br/>
	the moral melee.<br/>
	The elastic retreat rings the close of play as the last wave uncovers<br/>
	the newfangled way.<br/>
	But your new shoes are worn at the heels and<br/>
	your suntan does rapidly peel and<br/>
	your wise men don't know how it feels to be thick as a brick.<br/>
	</div>


	<a href="#part3" class="accord"><h3 id="part3">Part 3</h3></a>
	<div class="container">
	Really don't mind if you sit this one out.<br/>
	My words but a whisper -- your deafness a SHOUT.<br/>
	I may make you feel but I can't make you think.<br/>
	Your sperm's in the gutter -- your love's in the sink.<br/>
	So you ride yourselves over the fields and<br/>
	you make all your animal deals and<br/>
	your wise men don't know how it feels to be thick as a brick.<br/>
	And the sand-castle virtues are all swept away in<br/>
	the tidal destruction<br/>
	the moral melee.<br/>
	The elastic retreat rings the close of play as the last wave uncovers<br/>
	the newfangled way.<br/>
	But your new shoes are worn at the heels and<br/>
	your suntan does rapidly peel and<br/>
	your wise men don't know how it feels to be thick as a brick.<br/>
	</div>
	<a href="#part2" class="accord"><h3 id="part2">Part 2</h3></a>
	<div class="container">
	Really don't mind if you sit this one out.<br/>
	My words but a whisper -- your deafness a SHOUT.<br/>
	I may make you feel but I can't make you think.<br/>
	Your sperm's in the gutter -- your love's in the sink.<br/>
	So you ride yourselves over the fields and<br/>
	you make all your animal deals and<br/>
	your wise men don't know how it feels to be thick as a brick.<br/>
	And the sand-castle virtues are all swept away in<br/>
	the tidal destruction<br/>
	the moral melee.<br/>
	The elastic retreat rings the close of play as the last wave uncovers<br/>
	the newfangled way.<br/>
	But your new shoes are worn at the heels and<br/>
	your suntan does rapidly peel and<br/>
	your wise men don't know how it feels to be thick as a brick.<br/>
	</div>