The Main content area.
<aside class="main-sidebar col">
The Sidebar area.
Suppose we have given
But irrespective of what order is assigned to
.main-sidebar there should be gap between these two →
<div class="flex-main"> The Main content area. </div> ** GAP INTERMS OF PADDING OR MARGIN**
<aside class="main-sidebar col"> The Sidebar area. </aside>
Currently in my project here If I reverse the order the design breaks. see the Video here.
This happen because on the
.main-sidebar this is defined →
margin-left: 2.127659574468%; This should be changed to margin-right, but in this WordPress, this will create too much of the PHP Coding. I believe that there should be some spacing property between two flex items such that if we change the order spacing remains the same.