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

Question

[Антон Вебсайтовский]

Всем привет.

Сделал адаптивный контейнер в котором фотография и разной длины текст, где текст выходит за рамки блока, надо чтобы скрол показывался, а если не выходит текст за рамки, то надо скрывать скрол, но с этим проблема, пытался сделать, но скрол показывается, у контейнера max-height: 100%; - он адаптивный.

Еще проблему с отступами, не смог решить, применил паддинг внутри скрола, текст всеравно до нижний рамки блока касается, паддинг срабатывает но если прокрутить вниз, а если маргин сделать, прокрутка скрола начинает выходить за рамки.


Рабочий пример тут:
https://jsfiddle.net/4o9wupz5/1/

Answer 1

[ReActor Дмитрий Вершанский]

Из всего текста-обращения, понятна только фраза: "Всем привет"

Comments

[Антон Вебсайтовский]

Поправил текст ), ток проснулся.

[ReActor Дмитрий Вершанский]

Антон Вебсайтовский, пожалуйста https://jsfiddle.net/HunteR_VRX/kny0aqhw/15/

[ReActor Дмитрий Вершанский]

Исправил ссылку на https://jsfiddle.net/HunteR_VRX/kny0aqhw/15/

[ReActor Дмитрий Вершанский]

Антон Вебсайтовский, Что за одиночный тег <b> вы пытаетесь использовать, да еще и в целях верстки параграфа...Это уже какая-то новая спецификация HTML 6.0)

Для создания текстового контента, в контексте параграфа - используйте парный тег <p></p> и не придется делать разрывы строк тегом </br>, как вы это воспроизвели в своем исполнении.

[ReActor Дмитрий Вершанский]

Тег <b></b> является парным и служит для несемантического "ужирнения" части содержимого, которое им оборачивается. В css альтернатива этому свойство font-weight, со значением 700 или bold к примеру

[Антон Вебсайтовский]

HunteR-VRX, это понятно дело, я просто применяю теги по разному.

[ReActor Дмитрий Вершанский]

Антон Вебсайтовский, и, видимо, "по-разному" - тоже по разному применяете...

[Антон Вебсайтовский]

HunteR-VRX, все бы ничего, но я грид пока не использую, пока только флексы освоил, с ними проблем нет. а вот грид, не у всех будет работать.

[ReActor Дмитрий Вершанский]

Антон Вебсайтовский, какое отношение grid имеет к решению вашей ситуации, которое было предложено?
Хотите используйте float, хотите - flex / grid, на худой конец, можете попросту переопределить свойство display:

на значение
inline-block

Вы просили два момента реализовать:
1. Автопоявление скроллинга именно в текстовом контейнера, а не во внешнем, исходя из его переполнения
2. Наличие внутренних отступов у того же текстового контейнера

[ReActor Дмитрий Вершанский]

На счет поддержки grid и утверждения, что не у всех будет работать:
Время скоротечно, с момента объявления этой технологии, прошло без малого 3 года...
Советую почаще заглядывать, к примеру - сюда https://caniuse.com/#search=grid

Или вас волнует пользователи с opera-min? Тогда вопросов нет....)

[Антон Вебсайтовский]

HunteR-VRX, да я флекс использую можно что-то более старое, так у тебя там грид было в примере.

[Антон Вебсайтовский]

HunteR-VRX, 3 года это мало, чтобы все начали использовать что-то современное, у нас древний народ )