nebikoff
Постоялец
- Регистрация
- 5 Авг 2013
- Сообщения
- 480
- Реакции
- 196
- Автор темы
- #1
Переделываю сайт на широком шаблоне. Обрадовался, что нашел способ сделать удобную таблицу для просмотра. Но когда посмотрел на мобильных устройствах, ужаснулся. Возможно сделать такую таблицу для правильного просмотра на мобильных?
Код для одноколоночной таблицы, которые делает правильное отображение:
Код для одноколоночной таблицы, которые делает правильное отображение:
@media screen and (max-width: 600px) {
table.dop thead {
display: none;
}
table.dop tr {
display: block;
width: 100%;
}
table.dop td {
display: block;
text-align: center !important;
width: 100% !important;
height: auto !important;
}
table.dop td:before {
**content: attr(aria-label);
font-weight: 700;
width: 100%;
}
table.dop th {
display: block;
text-align: center;
width: 100%;
padding: 15px 5px;
}
table.dop {
margin-bottom: 15px;
width: 100% !important;
}
.item-inner {
padding-right: 10px !important;
}
}
table.dop thead {
display: none;
}
table.dop tr {
display: block;
width: 100%;
}
table.dop td {
display: block;
text-align: center !important;
width: 100% !important;
height: auto !important;
}
table.dop td:before {
**content: attr(aria-label);
font-weight: 700;
width: 100%;
}
table.dop th {
display: block;
text-align: center;
width: 100%;
padding: 15px 5px;
}
table.dop {
margin-bottom: 15px;
width: 100% !important;
}
.item-inner {
padding-right: 10px !important;
}
}