Conditional Bottom Border CSS

Hi Peeps. Can someone please tell me what’s wrong with this formula? I’m applying conditional logic to the bottom border of the default state of a text element. In both scenarios I want a 1px bottom border, but the color changes depending on whether or not a condition is true. Thanks!

you need to combine the colors and widths.

It should be something like this in the end “solid 1px [color]”

now you’re passing them separate which also confuses the underlying JS, what you want to do is the following, you need to make it two separate strings. Also, you’re using a wrong format.

I used the ternary operator, but it works the same with if I think.

Actually, if you want only the bottom border for example, you’ll need to try adding this to the custom CSS.

/* top | right | bottom | left */
border-width: 0px 0px 1px 0px;

I’m not sure if this will hit the spot though, try it out. I hope the custom CSS will target the right element, where you also have the border applied.

Because at the moment, there is no shorthand property for borders,

Your “;” should be +, like Broberto explained :slight_smile:

Thanks!