Проблема только с подсказкой CSS - PullRequest
0 голосов
/ 30 июля 2010

Использую простую подсказку только для CSS.

Рабочий пример CSS:

.tip
{
    position:relative;
}
.tip span.tooltip
{
    display:none;
    background:#ff5112;
    border:1px solid #9C0;
}
.tip:hover span.tooltip
{
    display:block;
    position:absolute;
    top:2em; left:2em; width:15em;
    border:1px solid #0cf;
    background-color:#cff; color:#000;
    text-align: center
}

HTML:

<span class="tip">
<table><tr>
<td>Working Tip</td><span class="tooltip">Tip</span>  
</tr></table>
</span>

Не работает пример: HTML:

<table><tr>
<span class="tip"><td>Not working TIP</td><span class="tooltip">Tip</span></span>
</tr></table>

И Живой пример

Ответы [ 6 ]

4 голосов
/ 30 июля 2010

Ваша проблема в элементе таблицы - у вас не может быть диапазона, охватывающего

. Избавьтесь от стола и все будет работать.
1 голос
/ 30 августа 2010

таблица в пределах диапазона не разрешена, попробуйте исправить это

1 голос
/ 30 июля 2010

Я не вижу ваш класс css всплывающей подсказки, попробуйте добавить один

0 голосов
/ 02 августа 2010

Решение, которое сработало для меня:

<table><tr><td>
<a href="blah.php" class="tip">
Blah Blah Text
<span class="tooltip">Blah Blah Tip</span>
</a>
</td></tr></table>

Но это выглядит очень плохо, если css выключен, поэтому лучше всего использовать атрибут title, а затем добавить mootools или такие библиотеки вверху.

Спасибо, ребята.

0 голосов
/ 30 июля 2010

<span class="tooltip"> должен идти внутри <td class="tip">, чтобы ваш текущий CSS работал должным образом ...

<table><tr> 
  <td class="tip">
    Working Tip
    <span class="tooltip">Tip</span>
  </td>
</tr></table> 
0 голосов
/ 30 июля 2010

Я думаю, что, возможно, я увижу ваш вопрос, но, поскольку вопрос опущен, я сделаю снимок. Второй пример имеет неправильный формат, если вы действительно хотели что-то до такой степени, это должно быть больше похоже на:

<span class="tip">
    <table>
        <tr>
            <td>Working Tip</td>
        </tr>
    </table>
    <span class="tooltip">Tip</span>  
</span>

Если вы собираетесь обернуть всю таблицу, «подсказка» должна быть после тега таблицы.

...