Отображать содержимое нижнего колонтитула централизованно

Question

Я пытаюсь отображать содержимое моего нижнего колонтитула централизованно, но, похоже, оно не работает.У кого-нибудь есть предложения?Заранее спасибо.

footer{
    position: fixed;
    bottom: 0;
    width: 100%;
    height:50px;
    color:whitesmoke;
    text-align:center;
    line-height:50px;
    ackground-color:#76323f;
    display:flex;
    align-items:center;
    justify-content:center;
}

<footer>
     Melbourne Public Library Catalogue Site: STAFF ONLY
     <img id ="html" src="Images/HTML5.png" class ="html"/>
     © 2018
</footer>

Answer 1

Я думаю, что это будет работать для вас.Попробуйте это:

footer {
    position: fixed;
    margin: auto;
    bottom: 0;
    width: 100%;
    height: 50px;
    color: whitesmoke;
    text-align: center;
    line-height: 50px;
    background-color: #76323f;
    display: flex;
    align-items: center;
    justify-content: center;
}

Answer 2

Я заметил, что у вас слово «background» было написано как «ackground» по ошибке, и это предотвратило темный цвет фона, поэтому белый текст не показывался и выглядел так, как будто нижний колонтитул не отображался.Вот фиксированный блок CSS.Это должно решить проблему, содержание нижнего колонтитула отцентрировано.Пожалуйста, дайте мне знать, если это помогло.

footer{
  position: fixed;
  bottom: 0;
  width: 100%;
  height:50px;
  color:whitesmoke;
  text-align:center;
  line-height:50px;
  background-color:#76323f;
  display:flex;
  align-items:center;
  justify-content:center;
}