Attempting to create a unique column layout for different device sizes. For medium (md) and larger devices, 2 columns are used: md-8 and md-4. However, on smaller devices, the intention is to display half of the content in the md-8 column, followed by half of the md-4 column, then the remaining md-8 column. Refer to the attached picture for clarification.
On mobile devices, the desired order is A, B, C, D stacked vertically. The issue arises with variable heights for A and B, leading to gaps between A & C or B & D. Seeking suggestions for optimizing the layout to eliminate these spaces.