CSS for navbar border not working

Hello-

I input the following CSS to create a bottom border on my nav bar that is a gradient but it is not working.

My CSS is…

.x-navbar {
border-bottom: 5px solid -webkit-linear-gradient(left, #79cc9e 0%,#beedec 25%,#c5ceff 50%,#cabd96 75%,#b591c7 100%);
}

website is leadas.love

Hello @KimAnn,

Thanks for asking. :slight_smile:

Actually there is syntax error in the code and that’s the reason why it’s not working. If you want to add gradient effect on border, please take a look at following tutorial. https://www.hongkiat.com/blog/css-gradient-border/

Thanks.

I checked the CSS in CSS Lint and there are no errors. Also checked out the link you sent but it does not have the information any longer on gradient for borders.

Hi there,

Your code is incorrect as it is not how to add a gradient border to an element:

You will have to rewrite the code and follow the correct CSS syntax for adding a gradient border.

You can refer to the same link previously suggested under Second Trick.

Hope this helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.