Как я могу сместить положения столбцов с четными номерами с помощью адаптивного макета столбца? - PullRequest
Новая
       41

Как я могу сместить положения столбцов с четными номерами с помощью адаптивного макета столбца?

0 голосов
/ 25 октября 2018

У меня проблема с css.Мне нужно отобразить список элементов с переменной высотой в столбцах.Каждый второй столбец должен быть смещен вниз: Layout to be don

Все это должно быть отзывчивым, поэтому HTML должен быть довольно простым списком.

То, что я пробовал, это flex,но не удалось для этой проблемы, а также количество столбцов.При подсчете столбцов, отображение ближе всего, и я мог бы добавить отступ к самому верхнему элементу во втором столбце, однако, поскольку он должен быть отзывчивым (различное количество столбцов в зависимости от ширины экрана), мне нужно выбрать первый элемент.во втором и четвертом столбце, который решит проблему.

Так что, если у кого-то есть идея, как решить эту проблему в css, я был бы счастлив, Это также будет работать, когда задействован Javascript, поэтому, если кто-то можетпомогите мне выбрать самый верхний элемент во втором столбце, это также будет оценено.

html code: 

<ul>
   <li>some content</li>
   <li>some content</li>
   <li>some content</li>
   <li>some content</li>
   <li>some content</li>
   <li>some content</li>
   etc.
</ul>

1 Ответ

0 голосов
/ 25 ноября 2018

Проблема решена с помощью JS (Jquery):

  • Приведенный выше список загружается в DOM как скрытый элемент
  • При использовании JS (Jquery) контент распределяется встолбцы в зависимости от окна.(также с изменением размера)
  • Оставшаяся работа выполняется с помощью CSS

Не приятно, но, похоже, единственное решение.

...