Strange blue underline for text?

Question

<p>Text adjustement
 <span>
  - [b](text)[/b] for <b>Bold</b><br>
  - [u](text)[/u] for <u>Underlined</u><br>
  - [i](text)[/i] for <i>Italic</i><br>
  - [s](text)[/s] for <s>Strike</s><br>
  <br>
  - [big](text)[/big] for big text<br>
  - [medium](text)[/medium] for medium-large text<br>
  - [small](text)[/small] for small text<br>
 </span>
</p>

table.fancy td.tdtop p {
    color: blue;
    display: block;
}

table.fancy td.tdtop p:hover {
    text-decoration: underline;
    cursor: pointer;
}

table.fancy td.tdtop p span {
    color: black;
    display: none;
    padding: 2px;
    padding-left: 4px;
    border: 1px solid #e0e0e0;
    background: #f0f0f0;
    text-decoration: none;
}

table.fancy td.tdtop p:hover span {
    display: block;
    text-decoration: none !imporant;
    color: black !imporant;
}

I'm trying to get a box to show up when you hover a <p>, but this is what i get:

Answer 1

DEMO

Is this what you need? problem with css cleaned up.