devoyager

Thanks for the suggestion!

The main reason I’m looking for a WordPress plugin rather than using YouTube is that my videos are courses, and I want more control over my content. With YouTube, I’m worried about my videos being shared or publicly accessible, which I want to avoid for privacy and content protection reasons.

Have you tried regenerating the CSS & data with Elementor or switching themes? Sometimes, the issue can be related to how CSS files are loading or a theme conflict.

Regenerating the CSS might help resolve issues like missing elements or misalignment when the page first loads.

If that doesn’t work, you could try temporarily switching to a default WordPress theme (like Twenty Twenty-Five) to see if the issue persists. This can help you determine if the problem is theme-related or something else

Here’s the solution I used:

.container-gradient {
  position: relative;
  border-radius: 19px;
}

.container-gradient::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 19px;
  padding: 1px;
  background: linear-gradient(to right, #E03609, #F0B71F);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}

This ensures both the gradient border and rounded corners work as expected.

I hope this helps anyone encountering the same issue.

Hi @vefaakin,

Thanks for the suggestion! I tried adding !important to the border-radius, but it didn’t solve the issue. It seems the problem was with how border-image and border-radius interact.

I ended up using a pseudo-element (::before) to fix it.

Thanks again!

Thanks for the suggestion! Unfortunately, I don’t have a WooCommerce account or any of their paid products. Is there anything else I can try on my own, like adding custom code or tweaking something?

Thank You