Clickable images

Hi,

Thank you for bringing this to our attention. We released a new version. Please upgrade.

Now if you use important flag like the following then it should work.

.slider_hero_btn_cls_one1 {
  border: 1px solid #fff !important;
}

Thanks

Hi @quantumcloud,

Thank you for the prompt support.

I installed the new version, created a new slider with only one slide and a button, added the CSS code below to my theme’s style.css, but didn’t see a difference.

.slider_hero_btn_cls_one2 {
  border: 1px solid #fff !important;
}

Behaviour is visible at this link.

In the inspector, my style.css change is struck out unless I untick the following code at two inline occurrences listed above my style.css change:

.slider_hero_btn_cls_one2 {
  border: 2px solid !important;
}

Thank you.

• This reply was modified 3 years ago by Jan Dembowski.
• This reply was modified 3 years ago by wpguillaume. Reason: missing link?

Hello @quantumcloud, would you by any chance have some more time to take a look again at this issue?

Thank you! ??

Hi,

Missed your last message somehow. Thanks for the follow-up. We released a new version. Please update and check again.

Thanks

Hi @quantumcloud,

Thank you again for the fast response, I missed it when you posted and just got back to the issue.

I’m getting somewhere with the following code:

.qcld_hero_content_area {
	top: 0px !important;
	height: 100% !important;
}
.hero_slider_btn2 {
	width: 100% !important;
	height: 100% !important;
	padding: 0px !important; /* this one is ignored, see below */
}
.slider_hero_btn_cls_one2 {
	width: 100% !important;
	height: 100% !important;
}

It seems another inline “!important” tag is preventing me from sizing the button to the full page width:

.hero_slider_btnX {
    padding: 0px 10% !important;
}

Would it be possible to remove it as well?

Also, the button is not exactly centered (see link). I’m toying around the CSS code with my browser’s dev tools, but if you know what I should do, I’d love to hear it, I’m struggling a little. ??

Thanks.

Hi,

We released a new version. Please upgrade and check.

Thank you!

Hi @quantumcloud,

Thank you very much, I got it to work in the end.

For those interested, if you have just one button per image, with just a space character as button title, with no title nor description for each image, the following CSS code is what I added to the style.css file:

.qcld_hero_content_area {
	top: 0px !important;
	height: 100% !important;
	position: sticky !important;
}
.hero_slider_btn1 {
	height: 100% !important;
	width: 100% !important;
	padding: 0px !important;
}
.slider_hero_btn_cls_one1 {
	height: 100% !important;
	width: 100% !important;
	border: 0px !important;
}

There might be better/cleaner ways to do it, though, I wouldn’t know. ??

You are most welcome!
Thank you for your cooperation and constructive feedback.

Regards