<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<section id="pinBoot">
<article class="white-panel"><img src="http://champignonkwekerij.be/develop/appbay/afbeelding/champignonkompost.jpg" alt="">
<h4><a href="#">Paddenstoelenwandeling</a></h4>
<p>Van het totale gewicht aan verse compost waarmee een teelt wordt begonnen,
blijft aan het einde ongeveer de helft over. </p>
<p>Afgewerkte champignonmest wordt veel voor bemestingsdoeleinden gebruikt en wordt daarom
regelmatig geanalyseerd. Verder kan je afgewerkte champignonmest ook gebruiken tussen de
groenten en bloemen. </p>
<p>Bij koud weer zorgt het voor bescherming en bij warm weer voorkomt het uitdroging van de grond.
Wanneer je wat champost tussen de bloemen en groenten aanbrengt zorgt het ervoor dat je ook weinig
onkruid zal bespeuren. In het algemeen wordt champost beschouwd als een aantrekkelijk materiaal om de
bodemstructuur te verbeteren. Het bevat veel organische stof, weinig zware metalen en geen
onkruidzaden of ziektekiemen die schadelijk zijn.
</p>
<p>
Wel moet bij het gebruik ervan rekening worden gehouden met het hoge kalk-en zoutgehalte.
Calcium komt voornamelijk voor als CaCO3 maar ook als CaSO4.
Calcium kan een probleem vormen als champost wordt toegepast in teelten die een lage pH
nodig hebben terwijl het oplosbare zout een probleem kan vormen in gronden die al veel zout
bevatten of in zoutgevoelige gewassen. In serres is de kans op deze problemen groter dan in
vollegrondsteelten. Bij gebruik in serres is het dus ook aangeraden de champost tijdig te
vermengen met de grond.
</p>
<p>
Bij het gebruik van champost wordt een belangrijke hoeveelheid organische stof aan de
bodem toegevoegd. Organische stof heeft een positieve invloed op de structuur van de grond.
Hoe meer organische stof een grond bevat, hoe groter het vochthoudende vermogen is. Dit is
met name van belang op droge gronden. Organische stof absorbeert mineralen als kalium,
calcium, magnesium en ammonium. Deze spoelen daardoor minder snel uit.
</p>
<p>Je kan best vooraf contact met ons opnemen indien je champost wenst aan te kopen. Te
verkrijgen per zak of per aanhangwagen. De samenstelling: (per ton verse champost)</p>
<table class="table ">
<tbody>
<tr>
<td>droge stof </td>
<td>340 kg </td>
</tr>
<tr>
<td>organische stof</td>
<td>214 kg </td>
</tr>
<tr>
<td>soortelijk gewicht</td>
<td>500 kg/m3 </td>
</tr>
<tr>
<td>Stikstof (N)</td>
<td>6,3 kg </td>
</tr>
<tr>
<td>P2O5</td>
<td>4,0 kg</td>
</tr>
<tr>
<td>CaO</td>
<td>45,0 kg </td>
</tr>
<tr>
<td>MgO</td>
<td>2,4 kg</td>
</tr>
</table>
</tbody>
</article>
<article class="white-panel"> <img src="http://roosendaal.groei.nl/fileadmin/Afdelingen/Roosendaal/201311/paddenstoelenwandeling/paddenstoelenwandeling__2_.jpg" alt="">
<h4><a href="#">Groei van een paddenstoel</a></h4>
<p>De paddestoelen in onze provincie groeien dit jaar veel vroeger dan normaal. De eerste paddestoelen komen normaal pas in de herfst boven de grond, maar zijn nu in augustus al te bewonderen. </p>
</article>
<article class="white-panel"> <img src="http://www.odeaanaude.eu/catalogaude2/images/montolieu76.jpg" alt="">
<h4><a href="#">Truffel degustatie</a></h4>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute
lpa qui officia deserunt mollit anim id est laborum.</p>
</article>
</section>
<hr>
</div>
<p>
<a href="http://validator.w3.org/check?uri=http%3A%2F%2Fbootsnipp.com%2Fiframe%2FZkk0O" target="_blank"><small>HTML</small><sup>5</sup></a>
<br>
<br>
</p>
</div>
/*
Ref:
Thanks to:
http://www.jqueryscript.net/layout/Simple-jQuery-Plugin-To-Create-Pinterest-Style-Grid-Layout-Pinterest-Grid.html
*/
body {
background-color:#eee;
}
#pinBoot {
position: relative;
max-width: 100%;
width: 100%;
}
img {
width: 100%;
max-width: 100%;
height: auto;
}
.white-panel {
position: absolute;
background: white;
box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.3);
padding: 10px;
}
/*
stylize any heading tags withing white-panel below
*/
.white-panel h1 {
font-size: 1em;
}
.white-panel h1 a {
color: #A92733;
}
.white-panel:hover {
box-shadow: 1px 1px 10px rgba(0, 0, 0, 0.5);
margin-top: -5px;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}
$(document).ready(function() {
$('#pinBoot').pinterest_grid({
no_columns: 1,
padding_x: 50,
padding_y: 50,
margin_bottom: 50,
single_column_breakpoint: 700
});
});
/*
Ref:
Thanks to:
http://www.jqueryscript.net/layout/Simple-jQuery-Plugin-To-Create-Pinterest-Style-Grid-Layout-Pinterest-Grid.html
*/
/*
Pinterest Grid Plugin
Copyright 2014 Mediademons
@author smm 16/04/2014
usage:
$(document).ready(function() {
$('#blog-landing').pinterest_grid({
no_columns: 4
});
});
*/
;(function ($, window, document, undefined) {
var pluginName = 'pinterest_grid',
defaults = {
padding_x: 10,
padding_y: 10,
no_columns: 3,
margin_bottom: 50,
single_column_breakpoint: 700
},
columns,
$article,
article_width;
function Plugin(element, options) {
this.element = element;
this.options = $.extend({}, defaults, options) ;
this._defaults = defaults;
this._name = pluginName;
this.init();
}
Plugin.prototype.init = function () {
var self = this,
resize_finish;
$(window).resize(function() {
clearTimeout(resize_finish);
resize_finish = setTimeout( function () {
self.make_layout_change(self);
}, 11);
});
self.make_layout_change(self);
setTimeout(function() {
$(window).resize();
}, 500);
};
Plugin.prototype.calculate = function (single_column_mode) {
var self = this,
tallest = 0,
row = 0,
$container = $(this.element),
container_width = $container.width();
$article = $(this.element).children();
if(single_column_mode === true) {
article_width = $container.width() - self.options.padding_x;
} else {
article_width = ($container.width() - self.options.padding_x * self.options.no_columns) / self.options.no_columns;
}
$article.each(function() {
$(this).css('width', article_width);
});
columns = self.options.no_columns;
$article.each(function(index) {
var current_column,
left_out = 0,
top = 0,
$this = $(this),
prevAll = $this.prevAll(),
tallest = 0;
if(single_column_mode === false) {
current_column = (index % columns);
} else {
current_column = 0;
}
for(var t = 0; t < columns; t++) {
$this.removeClass('c'+t);
}
if(index % columns === 0) {
row++;
}
$this.addClass('c' + current_column);
$this.addClass('r' + row);
prevAll.each(function(index) {
if($(this).hasClass('c' + current_column)) {
top += $(this).outerHeight() + self.options.padding_y;
}
});
if(single_column_mode === true) {
left_out = 0;
} else {
left_out = (index % columns) * (article_width + self.options.padding_x);
}
$this.css({
'left': left_out,
'top' : top
});
});
this.tallest($container);
$(window).resize();
};
Plugin.prototype.tallest = function (_container) {
var column_heights = [],
largest = 0;
for(var z = 0; z < columns; z++) {
var temp_height = 0;
_container.find('.c'+z).each(function() {
temp_height += $(this).outerHeight();
});
column_heights[z] = temp_height;
}
largest = Math.max.apply(Math, column_heights);
_container.css('height', largest + (this.options.padding_y + this.options.margin_bottom));
};
Plugin.prototype.make_layout_change = function (_self) {
if($(window).width() < _self.options.single_column_breakpoint) {
_self.calculate(true);
} else {
_self.calculate(false);
}
};
$.fn[pluginName] = function (options) {
return this.each(function () {
if (!$.data(this, 'plugin_' + pluginName)) {
$.data(this, 'plugin_' + pluginName,
new Plugin(this, options));
}
});
}
})(jQuery, window, document);