Как сделать перенос на новую строку при padding?

Question

[zanyato11111]

Здравствуйте, делаю простую систему комментариев. Возникла проблема с разметкой. При очень длиной ветке ответов, комментарии начинают уходить за пределы страницы. Как можно исправить данную проблему?
Пробовал через js сверять ширину рута комментария с общей шириной страницы и в случае, если комментарий больше ширины страницы, то менять padding-left на padding-right. Но при большом размере экрана комментарии все равно вылетают за пределы разметки. Работает такой подход только на мобильных.

Вот, небольшой пример моего кода: https://codepen.io/TheVol/pen/yLRodEd

При ответе на комментарий идет смещение по padding-left на 100px

Answer 1

[Сергей delphinpro]

Смотрите на уровень вложенности комментария, и если он больше Х, то больше не делайте отступы.

Comments

[zanyato11111]

А как можно определять тот самый X ?

[Сергей delphinpro]

zanyato11111, разными методами.

[zanyato11111]

Сергей delphinpro, а пример небольшой можно?

[Сергей delphinpro]

zanyato11111, ну если чисто на CSS то как то так

.answer .answer .answer .answer .answer {
  padding-left: 0; // Для пятого уровня и последующих убрать отступы
}

[zanyato11111]

Сергей delphinpro, хм, действительно можно так задавать уровень вложенности. Но как можно определять сам уровень? Например, для более больших размеров экрана - более больший уровень вложенности, а для экранов поменьше - более меньший уровень. Можно, наверно, через медиа запросы это делать? Но вот, я сейчас определил примерный уровень - это 50. Это получается надо 50 раз прописать в стили ".answer .answer .answer .answer .answer....". А для меньшего разрешения, уже где-то 40-45. Мне кажется, это не совсем правильное решение в ручную под каждое разрешение прописывать padding

[Сергей delphinpro]

zanyato11111,

Но вот, я сейчас определил примерный уровень - это 50

Вы о чём?
50 * 100px = 5000px
Нормальный такой монитор...