Могу ли я заставить одну таблицу отображаться иначе, чем другие в адаптивном представлении? - PullRequest
0 голосов
/ 02 августа 2020

Я создаю веб-сайт на wordpress, используя тему «Rook ie», и установил плагин sportpress, а также плагин для аккордеона.

Я хотел бы отобразить таблицу аккордеонами, но и на мобильном устройстве. Это веб-страница> http://wnu.054.myftpupload.com/fixtures-and-results/

Я отсортировал это для большинства таблиц (фикстуры за месяц), используя следующие CSS:

.table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
  background-color: #dddddd;
}
@media only screen and (max-width: 40em) {
    
    thead th {
        display: none;
    }

    td, th {
        display: block;
    }

    td[data-th]:before  {
        content: attr(data-th);
    }
}
table {
    border-spacing: 0;
    }

    td,
    th {
    padding: 0.5em;
    }

    th {
    font-weight: bold;
    text-align: left;
    }

    thead th {
    background-color: #999;
    color: white;
    }

    td > div {
    float: right;
    }
@media screen and (max-width: 500px) {
thead th {
    display: none;
}

thead th:first-child:after {
    content: "'s";
}

td, th {
    display: block;
    width: 100% !important;
}


td[data-th]:before {
    content: attr(data-th);
    border-radius: 10px 0px 0px 10px;
    font-weight: bold;
    min-width: 10rem;
    display: inline-block;
}

У меня проблема в том, что у меня нет доступа для редактирования таблиц в Sportspress, поэтому я не могу редактировать данные таблицы в таблице статистики игрока, поэтому что он включает 'data-th = "heading"' - это означает, что заголовки не отображаются.

Без CSS выше таблица sportspress отображает ОК (не идеально, но и неплохо), Мне было интересно, могу ли я настроить его так, чтобы таблица sportspress игнорировала CSS, которые я установил (в отзывчивом представлении), или есть лучший способ сделать это? Если возможно, таблица sportpress будет отображать заголовки, но я думаю, что мне придется обновиться с бесплатной версии?

...