Форум Сайтостроение Веб-строительство

CSS: пропорциональная ширина

M
На сайте с 18.05.2014
Offline
24
milkikilki
611

Подскажите пожалуйста как реализовать следующее:

Есть блок фиксированной ширины в 200px, в котором выводятся дополнительные мини-изображения товара.

Миниатюры имеют ширину 25% - тоесть в одну строку влазит 4 изображения - все следующее переносится с новой строки.

Как сделать так - чтоб ширина миниатюр была плавающей, зависила от количество изображений в блоке.

Иными словами. Если есть пятое изображение - то все пять изображения должны автоматически с 25% перепрыгнуть на 20% и уместится в одну строку. Если 10 изображений - все дожны получить width:10%;

LEOnidUKG
На сайте с 25.11.2006
Offline
1774
LEOnidUKG
#1

js вам в помощь

✅ Мой Телеграм канал по SEO, оптимизации сайтов и серверов: https://t.me/leonidukgLIVE ✅ Качественное и рабочее размещение SEO статей СНГ и Бурж: https://getmanylinks.ru/ ✅ Настройка и оптимизация серверов https://getmanyspeed.ru/
werty1001
На сайте с 30.03.2008
Offline
82
werty1001
#2 

$('div').each(function () {

      var a=$(this).find("img");      

      a.width(100/a.length+"%");      

  });

Живой пример.

Магазин аккаунтов с балансом Litres,DNS,Ozon,Rotapost и еще 50+ других сервисов тут - vk.cc/7QK0Sk
M
На сайте с 18.05.2014
Offline
24
milkikilki
#3
werty1001:
$('div').each(function () {

      var a=$(this).find("img");      

      a.width(100/a.length+"%");      

  });


Живой пример.

Спасибо большое

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий