Button Not Working - Question | JoomShaper

Button Not Working

C

caroline.b

SP Page Builder 1 month ago

I am designing a website, which you can find at: webdesign-caroline.site, using the Justice template from JoomShaper. I have spent a lot of time working on the layout of the home page. The client created a layout using AI, so I got to work! However, I ran into some issues with the positioning of the buttons, especially when trying to make everything look good on desktop, smartphone, and tablet. Now I’ve noticed that the “OFFERTE AANVRAGEN” button just below the large slider image is not clickable. This is probably due to a layout issue or a z-index problem. I can’t seem to get it fixed.

I received a reply from the support: Please add the following CSS code to your Template Options -> Custom Code -> Custom CSS #section-id-2be75bf7-cf55-4e3d-b6d2-8c3c99ca1946{z-index:-1 !important; }

I adjusted the z-index; now the 'OFFERTE AANVRAGEN' button works, but the links underneath it no longer work Can you help me please? Thanks!

0
7 Answers
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 1 month ago #215525

You're welcome. The issue you were experiencing was caused by overlapping layout sections, which prevented the button from functioning correctly. I adjusted the z-index values so the interactive elements are properly layered. This resolved the conflict and restored the expected behavior.

Please marked the issue as solved

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 1 month ago #215521

Hello caroline,

Sorry for the inconvenience you're experiencing with the button. Could you please check if the issue is resolved now?

Looking forward to your response.

Best regards

0
C
caroline.b
Accepted Answer
1 month ago #215523

Super, it works. What did you change? That way I’ll know for the future as well

0
C
caroline.b
Accepted Answer
1 month ago #216624

A few days ago I had issues with a button related to the z-index. I thought everything was working with the following CSS: CSS#section-id-ccc6b5a0-c938-4bf9-b50f-6e83c8a19ac0 { z-index: 10 !important;}Meer regels weergeven However, it turns out that the button does not work on a smartphone. I tried increasing the z-index even further, but it still doesn’t work.

Can you help please, thanks

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 1 month ago #216674

Hello Caroline,

Sorry for the inconvenience you're experiencing. Please add the following CSS code to your Template Options -> Custom Code -> Custom CSS:

div#sppb-addon-wrapper-9fd5f562-9553-4e8c-8be0-a230be09dc6c {
    width: 256px;
}

If this doesn't solve the issue, please reach out and I'll look into it more deeply.

Best regards

0
C
caroline.b
Accepted Answer
1 month ago #216686

Thanks a lot, it is working and I added the css code in the page settings, not in de template options. But I think everything is working now!!!

0
Atick Eashrak Shuvo
Atick Eashrak Shuvo
Accepted Answer
Support Agent 1 month ago #216695

You’re very welcome — I’m glad to hear it’s working now.

Adding the CSS in the page settings is perfectly fine, and if the result matches your expectations, there’s no issue with that approach. Should you need to apply the same styling globally in the future, moving it to the template options would be the recommended step.

If you run into anything else or need further assistance, feel free to reach out.

0