Сдвиг текста выше внутри нижнего колонтитула в материализации - PullRequest
Новая
       30

Сдвиг текста выше внутри нижнего колонтитула в материализации

0 голосов
/ 01 июня 2019

У меня есть нижний колонтитул материализации, чью высоту я установил на 35 пикселей. Но проблема в том, что текст внутри нижнего колонтитула исчезает. Как сдвинуть его вверх, когда он исчезает с экрана, когда я уменьшаю размер нижнего колонтитула 

  <footer style="position:fixed;bottom:0;left:0;width:100%;" class = "page-footer">

 <div class = "footer-copyright">

    <div class = "container">
       © 2016 Copyright Information
       <a class = "grey-text text-lighten-4 right" href = "#!">Designed & Developed by XYZ</a>
    </div>
 </div>

Что дает мне

enter image description here

Теперь, когда я применил CSS, чтобы уменьшить размер нижнего колонтитула и переместить текст внутри контейнера вверх, я получаю. 

    footer {
       height: 35px;
    }
    footer .container {
       margin-bottom : 50px;
    }

enter image description here

Текст был удален, и когда я попытался переместить этот текстовый контейнер вверх, он не работал.

Как я могу решить эту проблему и где я иду не так.

Примечание: я перепробовал все ответы, которые получил, но ни один из них не помог мне.

1 Ответ

1 голос
/ 01 июня 2019 
footer .container {
  margin-bottom: 50px;
}

Это не работает, потому что .container находится внутри footer с фиксированной высотой.

Во избежание исчезновения текста вы можете попробовать добавить высоту строки в нижний колонтитул с тем же значением: 

footer {
  height: 35px;
  line-height: 35px;
}

И если вы хотите добавить дополнительное пространство внизу, вы можете добавить отступ: 

footer {
  height: 35px;
  line-height: 35px;
  padding-bottom: 50px;
}

;)

...