Question

Прописывая код таблицы для одного информера, столкнулась с рядом проблем:

1. Мой код выглядит так:

 

<style type="text/css">
   TABLE {
    width: 100%; /* Ширина таблицы */
    border-collapse: collapse; /* Убираем двойные линии между ячейками */
    border: 2px ridge #ccc; /* Рамка вокруг таблицы */
    border-radius: 5px; /* Уголки */
   }
   TH {
    background: #ffffff; /* Цвет фона */
    color: #000000; /* Цвет текста */
   }
   TD, TH {
    padding: 1px; /* Поля вокруг содержимого ячеек */
    border: 0px;
   }
  </style>

<table border="1" cellpadding="2" cellspacing="1" width="100%" class="infTable">
<tr>
<td width="50%" style="font:7pt">
<div><a href="$ENTRY_URL$">$ENTRY_TITLE$</a></div>
</td>
</tr>
<tr>
<td class="infTitle" colspan="2"> 
<div class="cMessage">$MESSAGE$</div><?if($ANSWER$)?><div class="cAnswer"><b>Answer</b>: $ANSWER$</div><?endif?></div>
</td>
</tr>
</table>

 

При вставке стилей CSS в информер над кодом таблицы - автоматически меняется также вид всех таблиц сайта.

Почему так происходит? Как избежать этой проблемы?

2. Пыталась сделать закругленные границы таблицы, изменить ее фон на белый, что видно из моего CSS кода, однако это не срабтало. Расскжите пожалуйста, почему так? Юкоз не поддерживает некоторые коды CSS  также как HTML? Если так, то можно ли где-то посмотреть полный список поддерживаемых кодов и тегов?

 

Answer 1

А вы айди таблицам задавайте и применяйте эти стили к конкретному айди и не нужно будет после лепить стили прямо в информерах.

Как-то так, ваш код таблицы заменим на:

<table id="tab-1" border="1" cellpadding="2" cellspacing="1" width="100%" class="infTable">
<tr>
<td width="50%" style="font:7pt">
<div><a href="$ENTRY_URL$">$ENTRY_TITLE$</a></div>
</td>
</tr>
<tr>
<td class="infTitle" colspan="2"> 
<div class="cMessage">$MESSAGE$</div><?if($ANSWER$)?><div class="cAnswer"><b>Answer</b>: $ANSWER$</div><?endif?></div>
</td>
</tr>
</table>

После в таблицу стилей CSS добавим в самый низ стили:

#tab-1 table {
    width: 100%; /* Ширина таблицы */
    border-collapse: collapse; /* Убираем двойные линии между ячейками */
    border: 2px ridge #ccc; /* Рамка вокруг таблицы */
    border-radius: 5px; /* Уголки */
   }
#tab-1 th {
    background: #ffffff; /* Цвет фона */
    color: #000000; /* Цвет текста */
   }
#tab-1 td,#tab-1 th {
    padding: 1px; /* Поля вокруг содержимого ячеек */
    border: 0px;
}

после все будет как положено.

Comments

Спасибо, все получилось!