Как сделать так, чтобы дизайн нижнего колонтитула не влиял на всю страницу? ⇐ CSS

[Anonymous]

Я создал этот нижний колонтитул, но когда я включаю его в свой base.html, он меняет стиль других частей, я думаю, из-за его CSS, и некоторые значки выглядят странно, что мне делать?? если мне нужно опубликовать еще часть кода, дайте мне знать

Заранее спасибо

мой index.html (нижний колонтитул)

[*] Документ Изображение от kjpargeter на Freepik Значок «Читающий единорог» от Значки8 нижний колонтитул { заполнение: 0; маржа: 0; размер коробки: граница-коробка; } нижний колонтитул { цвет фона: прозрачный; } .footerContainer{ ширина: 100%; отступы: 70 пикселей, 30 пикселей, 20 пикселей; } .socialIcons{ дисплей: гибкий; оправдание-содержание: центр; } .socialIcons а{ текстовое оформление: нет; отступ: 10 пикселей; цвет фона: белый; поле: 10 пикселей; радиус границы: 50%; дисплей: гибкий; } .socialIcons а я { размер шрифта: 2em; цвет: #f48fb1; непрозрачность: 0,9; } /* Эффекты при наведении на значки социальных сетей*/ .socialIcons a:hover{ цвет фона: #f48fb1; переход: 0,5 с; } .socialIcons a:hover i{ белый цвет; переход: 0,5 с; } .footerNav{ поле: 30 пикселей 0; } .footerNav ул{ дисплей: гибкий; оправдание-содержание: центр; тип стиля списка: нет; } .footerNav уль ли а{ цвет: #49464e; поле: 20 пикселей; текстовое оформление: нет; размер шрифта: 1.3em; непрозрачность: 0,7; переход: 0,5 с; } .footerNav ul li a:hover{ непрозрачность: 1; } .footerBottom{ цвет фона: прозрачный; отступ: 20 пикселей; выравнивание текста: по центру; } .footerBottomp{ белый цвет; } .дизайнер{ непрозрачность: 0,7; преобразование текста: верхний регистр; межбуквенный интервал: 1 пиксель; вес шрифта: 400; поле: 0 пикселей 5 пикселей; } @media (макс. ширина: 700 пикселей){ .footerNav ул{ гибкое направление: столбец; } .footerNav уль ли{ ширина: 100%; выравнивание текста: по центру; поле: 10 пикселей; } }
мой base.html

{% load static %} {% заголовок блока %}{% endblock %} < / сценарий> {% включает 'top-menu.html'%} {% если сообщения %} {% для сообщения в сообщениях %} {{ сообщение }} × {% конец для %} {% конечный %} {% блокирует контент %} {% конечный блок %} {% включает 'index.html'%}

выглядит вот так