@zeni1agent

Как сделать не равномерную сетку из блоков div?

Я хочу попробовать сделать слой из блоков с позицией absolute с не равномерным распределением как здесь:

fseew.png

Но более хаотично с большим разбросом и случайно с большим количеством мелких деталей.

Единственное что я смог сделать это вот так:

for (var x = 0; x < 10; x++) {
   console.log(x*100);
  for (var y = 0; y < 10; y++) {
 $("#divi").append('<div id="fig" style="top:'+x*100+'px;left:'+y*100+'px;">g</div>');
}}


<div id="divi"></div>

#fig{
  background:red;
  position:absolute ;
  width:98px;
  height:98px;
}
  • Вопрос задан
  • 217 просмотров
Решения вопроса 2
ArsenyMatytsyn
@ArsenyMatytsyn
CEO iAmStudio, предприниматель.
Ты можешь задать размеры в соотношении на флексах, на простой и тупой блочной схема, на более подходящих гридах и использовать masonry-скрипт (не имеет смысла, если сделал на гридах). А уж абсолютно позиционировать точно нет смысла, по крайней мере, пока не дойдешь до кирпичной кладки, там это за тебя скрипт сделает.
Ответ написан
sniggering_deus
@sniggering_deus Куратор тега Вёрстка
Front-End Developer & Fullstack Designer
Можно с помощью гридов создать нечто подобное.



Проблему адаптивности можно решить медиа-запросами, или путём создания полностью адаптивной сетки. Собственно говоря с помощью гридов можно много всяких сеток сделать.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы