Можно ли задать auto-fit отдельному элементу?

Question

[Айнур Ярулин]

Здравствуйте, можно ли задать значение auto-fit отдельному элементу?
Везде в документации, приводят такой пример:

grid-template-columns: repeat(auto-fit, minmax(..., ...));

Но тогда это применится ко всем элементам, а мне нужно только для одного. (У меня всего 2 элемента)

Comments

[Андрей Федоров]

через запятую задавайте несколько ширин, без функции repeat()

[Айнур Ярулин]

Андрей Федоров, Вот так?

grid-template-columns: (auto-fit, minmax(..., ...)), minmax(..., ...)),

[Айнур Ярулин]

Андрей Федоров, а нет, как я показал не работает

[Андрей Федоров]

squadbrodyaga, repeat auto-fit нужен для переноса элемента на следующую строку. Если вы не хотите ничего переносить не пользуйтесь repeat auto-fit. Какого эффекта вы хотите добиться?

[Айнур Ярулин]

Андрей Федоров, я хочу, чтобы переносился только один элемент, если он не помещается

[Андрей Федоров]

squadbrodyaga, у вас их всего 2 насколько я понял.

grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

Если для элемента минимальной шириной 200px не будет хватать места на первой строке, он перенесется на вторую.

[Айнур Ярулин]

Андрей Федоров, вообщем вот, что я хочу сделать, я хочу, чтобы кнопка переносилась на новую строчку, если для неё не хватает места. А если задать repeat(), то инпут и кнопка будут одного размера, а это некрасиво.

[Андрей Федоров]

squadbrodyaga, а когда оно перенесено оно может быть одной ширины?

[Айнур Ярулин]

Андрей Федоров, да

[Андрей Федоров]

squadbrodyaga, блин, не получается на гридах. https://codepen.io/aliencash/pen/wvWEVzX?editors=1100

[Айнур Ярулин]

Андрей Федоров, спасибо большое, сейчас буду у себя всё переделывать

[Андрей Федоров]

squadbrodyaga, не надо ВСЁ. ) Переделайте только эту часть. Еще вопрос можно дополнить, может кто поумнее решит на гридах.