Почему мои свойства CSS сетки в WordPress не применяются к моему веб-сайту, хотя все остальное кажется им? - PullRequest
Новая
       1

Почему мои свойства CSS сетки в WordPress не применяются к моему веб-сайту, хотя все остальное кажется им?

0 голосов
/ 29 мая 2020

Мне нужно разместить сетку на веб-сайте моей страницы, но таблица стилей не принимает мои классы в элементах div моего PHP. Функции верхнего и нижнего колонтитула (get_header() и get_footer()) также находятся в файле .php, и они работают правильно. Кроме того, таблица стилей (style.css) вызывается в моей функции заголовка, и поэтому остальная часть сайта форматируется должным образом; но div для сетки не форматируются из таблицы стилей. Функция вызывает родительскую таблицу стилей, которую я редактирую. Других классов CSS с этими .class ссылками нет. Этот код находится внизу моей страницы style.css: 

.grid-container {
display: grid;
grid-template-columns: auto auto auto;
background-color: #2196F3;
padding: 10px;
}
.grid-item {
background-color: rgba(255, 255, 255, 0.8);
border: 1px solid rgba(0, 0, 0, 0.8);
padding: 20px;
font-size: 30px;
text-align: center;
}

Я ожидаю синюю сетку 9x9 с синим контуром с номерами 1-9 в каждом элементе сетки.

Вот код для моих элементов сетки и контейнера с некоторым текстом над ним: 

    <h1 class="has-text-align-center">Livestreams</h1>
    <p class="has-text-align-center">This page is dedicated to our live cameras we have installed across 
       the Platte River Basin.</p>

    <div class="grid-container">
        <div class="grid-item">1</div>
        <div class="grid-item">2</div>
        <div class="grid-item">3</div>
        <div class="grid-item">4</div>
        <div class="grid-item">5</div>
        <div class="grid-item">6</div>
        <div class="grid-item">7</div>
        <div class="grid-item">8</div>
        <div class="grid-item">9</div>
    </div>

Опять же, остальная часть веб-страницы стилизована: заголовок, строка меню, стили шрифтов, нижний колонтитул, et c, но сетка не форматируется (все числа находятся в самом левом углу страницы). Вот страница, чтобы вы могли видеть, что он делает:

http://plattebasintimelapse.com/trinity-test-page/

Я попытался переименовать имена классов во что-то действительно уникальное, на случай .grid-container или .grid-item используется где-то еще, но это также не решило мою проблему. Я также попытался снова вызвать таблицу стилей на моей странице .php, но безуспешно. Я также изучил дочерние темы, но это не совсем то, что я хочу делать, потому что мне это нужно только для элементов, которые я буду добавлять на свою страницу. Сетка DID работает, когда я помещаю стиль непосредственно в теги HTML, поэтому я знаю, что это проблема моей страницы CSS. Кто-нибудь знает об этом?

...