Docs

[yhshin1020]

Hey,

I have a bunch of text with links with a class “reports”.

I want to make it such that when i hover over the link it changes color and has a delay to it.

I’ve added this code:

#reports: hover{
  color: #eea904 !important;
  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
}

but they don’t seem to work.

Could anyone give me help?

Thanks

[yhshin1020]

This reply has been marked as private.

[Lely]

Hi There,

Upon checking, reports is define as ID and not class. Id should be unique and can only be used once. Please define it as class like on attached screenshot.

Then update this:

#reports {
    font-family: 'myriad-set-pro_thin';
    color: black;
    font-size: 20px;
    margin-top: 4%;
}

To this:

.reports {
    font-family: 'myriad-set-pro_thin';
    color: black;
    font-size: 20px;
    margin-top: 4%;
}

Then for the hover effect, use this instead:

.reports a:hover {
    color: #eea904 !important;
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1) !important;
}

Hope this helps.

[Author]

Posts