Athanor

Можно сделать через псевдо-элемент DEMO

Не совсем ясна суть проблемы, но предположу, что дело в отсутствии свойства border-collapse
попробуйте так, если не поможет, собирайте песочницу и кидайте в комменты, будем разбираться.

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

Да, вам может показаться это костыльным, но такова уж участь фронтэнд разработчиков. Наш стек развивался большую часть времени весьма стихийно, не имея какого-то конкретного плана, так что выбирать сильно не приходится :)

Обратите внимание на блок #main после применения скрипта, для него применяются стили:

.scroll-container, .scroll-container section, body, html {
    width: 100%;
    height: 100%;
}

Собственно, эти проценты берутся от родителя, если родителем выступает body, то все ок, т.к. для него применяются те же самые стили, в вашем же случае родителем выступает дополнительный блок, который этих стилей не имеет и по умолчанию не растягивается. Чтоб это исправить, достаточно прописать эти стили для этого блока так