У меня есть код CSS, который я хочу запускать только для определенного идентификатора страницы. Исторически это не было большой проблемой, но я далеко не эксперт по CSS. Ниже приведен код для создания удобного мобильного стола, и он прекрасно работает! НО, он работает на всех страницах, а не только на одном идентификаторе страницы, для которого я его установил.
@media only screen and (max-width: 767px) {
/* Force table to not be like tables anymore */
.page-id-17075 table,
thead,
tbody,
th,
td,
tr { display: block; }
/* Hide table headers (but not display: none;, for accessibility) */
.page-id-17075 thead tr {
position: absolute;
top: -9999px;
left: -9999px;
}
.page-id-17075 tr { border: 1px solid #ccc; }
.page-id-17075 td {
/* Behave like a "row" */
border: none;
border-bottom: 1px solid #eee;
position: relative;
padding-left: 50%;
white-space: normal;
text-align:left;
}
.page-id-17075 td:before {
/* Now like a table header */
position: absolute;
/* Top/left values mimic padding */
top: 6px;
left: 6px;
width: 45%;
padding-right: 10px;
white-space: nowrap;
text-align:left;
font-weight: bold;
}
/*
Label the data
*/
.page-id-17075 td.tg-031e { text-align: center; }
.page-id-17075 td:nth-of-type(1) { background-color: #eee !important; }
.page-id-17075 th.tg-zlxb {display: none !important;}
.page-id-17075 td:nth-of-type(2):before { content: "company 1"; }
.page-id-17075 td:nth-of-type(3):before { content: "company 2"; }
.page-id-17075 td:nth-of-type(4):before { content: "company 3"; }
.page-id-17075 td:nth-of-type(5):before { content: "company 4"; }
}
Где я ошибся?