Why is order property not working on divs in block container?
<p>I have one container with <code>display: block</code>. Inside them I have 3 divs. Now I wan't to order them like I coded, but that's not possible, because my container div is <code>display: block</code>, and not <code>display: flex</code>.</p>

<p>In my case, I want 3 divs to be one below the other. That's reason why I put block.</p>

<p>Here is JSFIDDLE demonstrated, what I tried to solve my problem.
<a href="https://jsfiddle.net/u441j2rv/1/" rel="nofollow">https://jsfiddle.net/u441j2rv/1/</a></p>

<p>HTML</p>

<pre><code>&lt;div id="blockContainer"&gt;
    &lt;div&gt;Block A&lt;/div&gt;
    &lt;div&gt;Block B&lt;/div&gt;
    &lt;div&gt;Block C&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>CSS</p>

<pre><code>#blockContainer{
    display: block;
}
#blockContainer div:nth-of-type(1){
  background:red;
  -webkit-order: 3;
  order:3;
}
#blockContainer div:nth-of-type(2){
  background:green;
  -webkit-order: 1;
  order: 1;
}
#blockContainer div:nth-of-type(3){
  background:blue;
  order: 2;
  order: 2;
}
</code></pre>