:after выходит за пределы контейнера и создает ненужную прокрутку по оси X, как это убрать?

Question

[alexeeey_kuznetsov]

Необходимо добавить такую линию в футер.

Создавал изначально как after для ссылок на соц сети, но эта линия добавляет прокрутки по оси X. Проверял в адаптивном изменении экрана хрома. И если уменьшить ширину до нужной, чтобы не выходила за пределы, то при отключении адаптивного режима в инстр. разработчика, то линия будет не доходить до конца экрана. Здесь тоже не понял в чём дело.
https://codepen.io/alexeeey_kuznetsov/pen/NmpJBE
Помогите сделать так, чтобы не было горизонтальной прокрутки.
UPD: Вопрос немного не так поставил: необходимо чтобы линия продолжалась за экраном, но прокрутки до конца её ширины не было. Т.е. у линия фиксированная ширина и на каждом отдельном экране, её край упирается в правый угол, и на разных экранах получается разная длина, за исключением широких экранов, у которых разрешение будет больше, чем фиксированная ширина линии, поэтому на таких мониторах её край виден будет.
Заранее спасибо!

Comments

[Ragtime Kitty]

А вы предлагаете по картинке определять что и как у вас там расположено?

[alexeeey_kuznetsov]

Ragtime_Kitty, https://codepen.io/alexeeey_kuznetsov/pen/NmpJBE

[Ragtime Kitty]

alexeeey_kuznetsov,

.container {
    overflow: hidden;
}

Answer 1

[Сергей Смирнов]

на контейнер(темный) накинуть overflow: hidden