Добавление вертикального пространства между элементами HTML (divs) в одном контейнере ⇐ CSS

[Anonymous]

(Изменить: так как после применения приведенного ниже решения у меня теперь есть пробелы между блоками каналов в представлении на рабочем столе, но это не работает в представлении на мобильных устройствах, платформа — Shopify)
У меня есть следующий код, и он хорошо работает, перетасовывая элементы внутри контейнера, но проблема в том, что блоки контента располагаются близко друг к другу, без вертикального пространства между ними.
Я пытался добавить между ними много тегов, таких как p и br, чтобы получить желаемое пространство, но это привело к неупорядоченному пространству, поэтому некоторые блоки получили место, а некоторые нет, а иногда это вообще останавливает перетасовку.
Поэтому мне нужен способ добавить пространство между всеми элементами div, сохраняя при этом функцию перетасовки.

Код: Выделить всё

  // Function to shuffle the order of elements within a container
function shuffleElements(container) {
var elements = container.children;
for (var i = elements.length; i >= 0; i--) {
container.appendChild(elements[Math.random() * i | 0]);

}
}

// Wait for the page to fully load before shuffling the elements
window.addEventListener('load', function() {
var container = document.getElementById('your-container-id'); // Replace 'your-container-id' with the ID of the container div that holds the RSS feed divs
shuffleElements(container);

});

Код: Выделить всё

[url=https://www.facebook.com/saudioffers6]‏عروض السعودية  saudi offers‏[/url]

[url=https://www.facebook.com/diyprocom]‏‎Diy pro‎‏[/url]

[url=https://www.facebook.com/MarinaFish2019]‏مارينا للأسماك والرخويات‏[/url]

[url=https://www.facebook.com/nursery.libya]‏مشتل تمنهنت‏[/url]

Подробнее здесь: https://stackoverflow.com/questions/786 ... -container