How to Alter the Style of the Footnote Tooltip Text with CSS?

  • Resolved ferthalangur

    (@ferthalangur)


    8 years, 2 months ago

    Hi. We love the plugin.

    I have been trying to figure out how to change the default font face and size of the tooltip text when a user hovers over the footnote number. I have tried the following unsuccessfully in custom CSS. Is this possible to do?

    I have tried each of these individually:

    .easy-footnote {
    font-family: helvetica, arial, sans-serif;
    font-size: 20pt;
    color: #000000;
    }

    .easy-footnote a { $same body as above }

    .easy-footnote a[title] { $same body as above }

    .qtip-content a { $same body as above }

    .qtip-content a[title] { $same body as above }

    Thanks,

    _rob_

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Jason Yingling

    (@yingling017)

    8 years, 2 months ago

    Hi there,

    Have you tried just targeting .qtip-content?

    That should allow you to set styles for the entire tooltip that displays. It looks like your other rules are targeting <a> elements specifically and .easy-footnote actually only wraps the <sup> element for hovering.

    .qtip-content {
    font-family: helvetica, arial, sans-serif;
    font-size: 20pt;
    color: #000000;
}

    That should work.

    Thread Starter ferthalangur

    (@ferthalangur)

    8 years, 2 months ago

    That did it. Thank you!

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘How to Alter the Style of the Footnote Tooltip Text with CSS?’ is closed to new replies.