Popover issues

[KuKreationz]

Hi,

I’m having a few issues with the popover(s) I’ve added to the page.

1. There is a z-index issue which I cannot solve
2. I have it set to hover but if you click it, it causes the page to jump to the top.

Here is how I have it setup:

(OSHA) is a federal organization (part of the Department of Labor) that ensures safe and
[extra title=“OSHA” info=“popover” info_place=“top” info_trigger=“hover” info_content="(OSHA) is a federal organization (part of the Department of Labor) that ensures safe and healthy working conditions for Americans by enforcing standards and providing workplace safety training."]Read more[/extra]

[friech]

Hi There,

Thank you for writing in, I don’t get the z-index issue on my end, please clarify how we can replicate it.

Regarding the jump to top issue, if you need the “read more” to link to a page, please add a href="URL" attribute to your shortcode.

If you want the “read more” to be unclickable, please add an attribute class="remove-href" to your shortcode, then add this to Theme Options > JS

jQuery( document ).ready(function($) {
 $(".remove-href").removeAttr("href");
});

Hope it helps,
Cheers!

[KuKreationz]

Hi,

Thanks for the solution regarding the jump to the top issue

As far as the z-index issue it happens below 1167px when the columns become closer together.

Thanks,

[Alaa]

Hi KuKreationz,

Please add this CSS code to (Pro > Theme Options > CSS):

@media screen and (max-width: 1300px){
    .x-column {
        z-index: auto;
    }
}

This should fix the z-index issue.

Thanks.

[KuKreationz]

Hi Alaa,

Thank you so much for the fix - have a great weekend ahead!

[friech]

We are delighted to assist you with this.

Cheers!