WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] probably easy — span tag and tooltips styling (3 posts)

  1. brittanie
    Member
    Posted 7 years ago #

    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.

  2. Kafkaesqui

    Posted 7 years ago #

    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;
    }

  3. brittanie
    Member
    Posted 7 years ago #

    As usual, you've rescued me. Thanks!

Topic Closed

This topic has been closed to new replies.

About this Topic