Как изменить строку сетки в медиа-запросе - PullRequest
Новая
       29

Как изменить строку сетки в медиа-запросе

0 голосов
/ 10 июля 2019

У меня есть нижний колонтитул на моей странице, который назначен строке сетки 20, последней строке сетки 20x20.Я хочу переназначить его на сетку 15 для меньших размеров носителя.

Вот CSS с медиазапросами: 

#footer_x{
    grid-column: 6 / 15;
    grid-row: 20 / 20;
    font-family: robotoregular;
    font-size: 6px;
    color: rgb(100,100,100);
    padding-left: 15%;
    transition-timing-function: ease-in 150ms;
}

@media (min-width: 320px) {
  #footer_x { 
    font-size: calc( 0.0125vw + 3px );
    grid-row: 15 / 15; }
}

@media (min-width: 960px) {
  #footer_x { 
    font-size: 12px;
    grid-row: 20 / 20; }
}

Вот CSS на контейнере сетки: 

.grid {
display: grid;
width: 100vw;
height: 100vh;
grid-template-rows: repeat(20, 5%);
grid-template-columns: repeat(20, 5%);
}

В то время как размер шрифта работает вМедиа-запросы, нижний колонтитул не меняет положение на мобильном телефоне, и появляется слишком далеко вниз страницы.Ничто другое в коде не повлияет на это.

Как изменить строку сетки для элемента с помощью медиа-запросов?

...