Как сделать принудительный запрет на перенос внутри тега TD?

Question

[iberk]

Использую materialize. Есть таблица. В одном из столбцов у меня 2 Select'а - мне нужно чтобы они были в один ряд, а они как я не пытался встают друг над другом... старые теги, применяемые к TD nowrap - не работают - может кто-нибудь помочь?

Comments

[Даниил Попов]

Не уверен, что точно понял вопрос, но это должно помочь наверняка:

заверните блоки в div и пропишите ему эти классы.

dispay: flex;
flex-flow: row nowrap;

[iberk]

Даниил Попов, не сработало( конечно можно переверстать таблицу на флексе, но есть загвозки с адаптивностью

[Даниил Попов]

Скиньте нам jsfiddle проблемное место. Посмотрим

[iberk]

Даниил Попов, заранее спасибо - https://jsfiddle.net/a26b35r1/75/

[Даниил Попов]

iberk, проблема в том, что селекты определены как блоки

select.browser-default {
    display: block;
}

переопределите на инлайн элемент. Тогда для них будут работать инлайн правила
Например так

select.browser-default {
    display: inline-block;
}

Но лучше создать для них отдельный класс

Answer 1

[Ankhena]

Не знаю, почему у вас не работает nowrap
https://jsfiddle.net/hnrgt3eL/

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

Comments

[iberk]

вопрос именно в фреймворке. Даже если я для тега TD определяю white-space: nowrap - все равно не срабатывает. https://materializecss.com/table.html

[Ankhena]

iberk, для select'ов задайте inline-block и ширину не 100%

[Ankhena]

iberk, например, как-то так https://jsfiddle.net/fj63ky0o/

[iberk]

Ankhena, так то оно работает конечно, но при уменьшении ширины сами селекты становятся нечитаемыми, поскольку они то уменьшаются, а вот столбцы как были так и остались

[Ankhena]

iberk, что-то у вас все в кучу.
Вы спросили как сделать, чтобы селекты не переносились. Я вам ответила.

а вот столбцы как были так и остались

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

[iberk]

Ankhena, спасибо! голова уже не соображает)