Rendering bug on the "line" element

[skargo2000]

Hello,
I’m having a rendering problem with the “line” element.

I need to create two lines dotted and two inverted gradients (to meet the client’s request).

It works fine in Cornerstone’s rendering (see screenshot), but it doesn’t work directly in a browser.

In cornerstone :

In navigateur (edge, chrome, brave, firefox …)

The second line with the inverted gradient disappears every time.
This is related to applying two different gradients.
How can I work around this?
I’ve searched for quite a while, but I can’t figure it out.

Thanks!

[prakash_s]

Hello @skargo2000,

Thanks for writing to us.

In order to help you with your concerns, we need to check your settings. I would request please share the admin login details meanwhile I would suggest you troubleshoot a few of the common issues before we investigate your settings. Please share your details in a secure note. Please provide the following details

• WordPress Login URL
• Admin-level username and password
• Exact page URL

You can find the Secure Note button at the bottom of your posts

Thanks

[tristup]

Hi @skargo2000,

It seems that the Element CSS is overriding the style for the second one in the same container. I copied the same Section and deleted one line from each Section, and now both lines are appearing.

Thanks

[skargo2000]

Thanks you pour help.

With both lines having the same gradient, it’s OK for me too, but I need one line with a gradient in one direction and the second line with a different gradient. (inverse)

like this :

And as soon as I apply the second gradient, the line disappears.

That’s my problem!

Merci !

[ruenel]

Hey Michael,

You can duplicate your line and then apply a 180-degree Y-rotate.
Check out the demo I created in the secure note below.

Cheers.

[skargo2000]

Hey Ruenel,

It works ! Merci !!

Best regards

[tristup]

Hi @skargo2000,

Glad that we are able to help you.

Thanks