Привет всем! Есть серый блок у которого overflow-x: scroll. внутри там квадратные

Question

Привет всем! Есть серый блок у которого overflow-x: scroll. внутри там квадратные

блоки (внутри еще квадратные зеленые блоки).
Если строка не превышает ширины блока с overflow, то никаких проблем (рис 1).
Но если начинает превышать, то внутренние квадратные блоки сжимаются и превращаются в прямоугольные (рис 2)

Как это можно победить?

ссылка на пример в codepen

#css #frontend #html #programming #russian

0

12.05.2022

17 ответов

22 просмотра

DevilSAM Автор вопроса

Konstantin
https://codepen.io/macroses/pen/vYdXKzB

gap?

0

12.05.2022

Konstantin

DevilSAM
gap?

что не так?

0

12.05.2022

DevilSAM Автор вопроса

Konstantin
что не так?

всё так. просто уточняю, что решает эту проблему ))

0

12.05.2022

Konstantin

DevilSAM
всё так. просто уточняю, что решает эту проблему )...

скорее минимальная ширина в 100px

0

12.05.2022

DevilSAM Автор вопроса

Konstantin
скорее минимальная ширина в 100px

ааа. не заметил. спасибо 👍 как просто всё оказалось.. а я чё-т и не подумал об этом 😅

0

12.05.2022

Konstantin

DevilSAM
ааа. не заметил. спасибо 👍 как просто всё оказал...

поставь еще Overflow: auto

0

12.05.2022

DevilSAM Автор вопроса

Konstantin
поставь еще Overflow: auto

а вот новый неожиданный поворот: link на codepen добавил стиль для row:hover но он работает только на ширину, которая вмещается в видимую область. Всё, что за пределами overflow - почему-то не стилизуется 🤔 есть предположения? P.S. overflow-x для каждого отдельного .row решает проблему, но мне такое не подходит, так как надо двигать только всё сразу.

0

12.05.2022

Konstantin

DevilSAM

а вот новый неожиданный поворот: link на codepen ...

потому что фитить контент надо

0

12.05.2022

Konstantin

DevilSAM

а вот новый неожиданный поворот: link на codepen ...

ты же не надеешься, что расширяя функционал, все твои предыдущие наработки будут постоянно работать как надо?