По какой причине может некорректно отображаться футер и навигационное меню, а именно не доходят до правого конца страницы?

Question

[niklazh]

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

не совсем понимаю, причина в HTML или CSS

.navigation-list a {
    font-size: 30px;
    color: #bdbdbd;
    text-decoration: none;
    margin-left: 13px;
    margin-right: 13px;
    padding-top: 0px;
    padding-left: 7px;
    padding-right: 7px;
}

.navigation-list a:hover {
    color: #bdbdbd;
    text-decoration: none;
    background-color: #292929;
    border-radius: 20px;
}

nav li {
    display: inline-block;
}

nav ul{
    font-family: 'Roboto Slab', serif;
    margin-top: 0px;
    padding-left: 0px;
    margin-bottom: 20px;
    background-color: #363636;
    width: 100%;

}

.footer a {
    font-family: 'Comfortaa', cursive;
    color: #ff6e6e;
    text-decoration: none;
}

.footer a:hover {
    text-decoration: underline;
}

footer {
    margin-top: 40px;
    padding-left: 40px;
    padding-top: 20px;
    background-color: #191919;
    width: 100%;
}

но что ещё интерснее, можно ли вообще убрать вертикальную прокрутку? она всё равно по сути не нужна и почти нигде её нет

Answer 1

[strelok011]

Такое бывает в ситуации, когда в контенте или в любом блоке присутствует элемент или контейнер шире, чем ширина страницы. Это могут быть как изображения, так и элементы у которых неправильно заданы параметры с шириной и паддингом.
Т.е. если есть элемент с шириной 100% и паддингом, ему надо бы указывать box-sizing: border-box;
Так же могут влиять неверно применяемые флоаты, флекс и прочее.
Первый шаг для проверки - накидывать overflow: hidden на контейнеры чтоб локализовать проблему, где именно находится распирающий элемент, либо в отладчике включить инструмент выбора элемента на странице и искать в пустой казалось бы области.

Comments

[niklazh]

СПАСИБО БОЛЬШОЕ, ты мой спаситель, я смог найти проблему с помощью подсказки про инструменты разработчика, у меня просто был один маленький элемент, ширина которого растянулась на очень много!