• Resolved brittanie

    (@brittanie)


    I want to create tooltips-style definitions for certain words upon hover. Most of these words are not links, and so I want them to be styled differently than links, but easily distinguishable from the rest of the words in a sentence.

    I’m using this code in-line:
    <span title="blah">Blah blah</span>

    And this CSS style:

    span {
    border-bottom: 1px dotted #ff3333;
    color: #ff3333;
    text-decoration: none;
    font-style: normal;
    cursor: help;
    }

    However, that is making EVERYTHING with the span tag show up as underlined, and this is not working for me.

    I’m sure there is a class I need to add but I’m brain-dead and can’t figure it out. In addition, I’m trying to keep the in-line code as simple and short as possible.

    Thanks in advance for any help.

Viewing 2 replies - 1 through 2 (of 2 total)
  • If I understand correctly (and I’m not sure I do), yes, you do want to set a class for these “certain words.” Basically you’d do:

    <span class="blah" title="blah">Blah blah</span>

    Which requires:

    .blah {
    border-bottom: 1px dotted #ff3333;
    color: #ff3333;
    text-decoration: none;
    font-style: normal;
    cursor: help;
    }

    Thread Starter brittanie

    (@brittanie)

    As usual, you’ve rescued me. Thanks!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘probably easy — span tag and tooltips styling’ is closed to new replies.