0 Пользователей и 1 Гость просматривают эту тему.
  • 5 Ответов
  • 1513 Просмотров
*

annetkas

  • Осваиваюсь на форуме
  • 16
  • 0 / 0
Всем привет!

Помогите решить проблему    !!!???!!!

Если смотреть с телефона, то страницы с таблицами (пример страницы) некорректно отображаются - не видны цены. При чем на некоторых, где экран больше отображается нормально, а на экранах меньше цены не видно  :'(

Нашла где в CSS прописаны эти таблицы, вот код:

Код
}
.tour_table {
    width: 100% !important;
    border-spacing: 0px !important;
    table-layout: auto !important;
    color: #1B3549 !important;
    margin: 10px 0px;
    border: none !important;
    border-collapse: separate !important;
}
.tour_table tr {
    height: auto !important;
}
.tour_table_wrap {
    margin: 0 auto!important;
}
.tour_table_wrap,.jspPane {
    overflow-x: visible !important;
    overflow-y:hidden;
}
.tour_table tr:hover td {
    background: #EBEDEC;
}
.tour_table th {
    background: #CFCFCF;
    height: 34px !important;
    text-align: center;
    padding: 5px 10px !important;
    font-size: 16px;
    color: #000000;
    font-weight: normal;
    border: none;
    border-bottom: 2px solid #fff;
    padding: 0;
}
.tour_table p {
    text-indent: 0;
}
.tour_table td:first-child,.tour_table th:first-child {
    -webkit-border-radius: 10px 0px 0px 10px;
    border-radius: 10px 0px 0px 10px;
    text-align: left;

Что и где необходимо исправить?    !!!???!!!
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
здра.
самое красивое решение - сделать короткие слова для шапки или же прописывать там внутри span-ов варианты длинных слов для десктопов и мобил.
типа
Код
школьников -> школь-ников
тогда на мобилах будет по дефису дробить и колонки уменьшать.
а вообще, приучайтесь размечать таблицу с использованием th, тогда будет проще потом настраивать такие моменты через стили, без использования всяких запросов на номера элементов.


*

annetkas

  • Осваиваюсь на форуме
  • 16
  • 0 / 0
здра.
самое красивое решение - сделать короткие слова для шапки или же прописывать там внутри span-ов варианты длинных слов для десктопов и мобил.
типа
Код
школьников -> школь-ников
тогда на мобилах будет по дефису дробить и колонки уменьшать.
а вообще, приучайтесь размечать таблицу с использованием th, тогда будет проще потом настраивать такие моменты через стили, без использования всяких запросов на номера элементов.

а сейчас то можно как-то исправить в стилях, чтобы таблица отображалась нормально?
*

effrit

  • Легенда
  • 10132
  • 1118 / 13
  • effrit.com
если все такие таблицы из з-х столбцов, то media-правило для экранов менее 400px
Код
.tour_table td {
width: 30% !important;
word-break: break-word;
}
*

annetkas

  • Осваиваюсь на форуме
  • 16
  • 0 / 0
если все такие таблицы из з-х столбцов, то media-правило для экранов менее 400px
Код
.tour_table td {
width: 30% !important;
word-break: break-word;
}
так?
Код
@media (max-width: 400px) {
  #sidebar {display: none;}
}
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Проблема с миниатюрами

Автор Stasweb

Ответов: 4
Просмотров: 786
Последний ответ 03.11.2020, 17:04:00
от Nikolay89
Проблема с меню на сайте

Автор nesskafe

Ответов: 9
Просмотров: 899
Последний ответ 01.06.2020, 11:03:58
от sivers
Проблема с меню на сайте и иконками Awesome

Автор Lemonez

Ответов: 1
Просмотров: 1196
Последний ответ 10.02.2020, 05:02:12
от Lemonez
Проблема шрифта bold

Автор web3.0

Ответов: 3
Просмотров: 2151
Последний ответ 06.04.2019, 09:50:36
от web3.0
Проблема с box-shadow

Автор dm-krv

Ответов: 2
Просмотров: 1419
Последний ответ 31.08.2018, 12:59:12
от dm-krv