Thread Starter
Chandan
(@whattechsays)
I found the problem.
The css is:
._f0c8e08 {
background-image: linear-gradient(.5 turn,rgba(0,0,0,0) 0%,rgba(0,0,0,.7) 100%);
}
But it should be.
._f0c8e08 { background-image: linear-gradient(180deg,rgba(0,0,0,0) 49%,rgba(0,0,0,.7) 100%); }
.5 turn is equivalent to 180 degrees, since 1 turn equals 360 degrees- Angles in CSS gradients need to be specified in deg/rad/grad units
- I kept the 49% and 100% color stop positions the same
So by changing .5 turn to 180deg, it will now be valid CSS syntax and produce the same visual effect.
Angles in CSS gradients need to be specified in deg/rad/grad units
That is actually not true. turn is a valid CSS unit for gradient direction/rotation.
The problem in your case is simply that the unit has a space in it. It should be .5turn , not .5 turn.
Which version of the plugin are you using?
Are you using any AMP-related plugins?
I’m asking about the version because we fixed an issue with that space ~3 years ago. With the current version I can definitely not reproduce the issue, so there must be something else interfering with the HTML output. You can also provide your Site Health info so we can try to figure out the culprit.
@whattechsays Since we haven’t received any further response, this topic will be marked as resolved. Please feel free to reopen this topic if the issue still occurs or create a new support topic for any other issues. Thank you.
