Setting borders on a label

Anvil Q&A
1

What I’m trying to do:
Set border-style via Anvil’s border property, per examples at CSS Borders .

What I’ve tried and what’s not working:
image

In this case, the idea is to set the top border to a double-underline, e.g., to suggest that the label contains a total from the column above. However, the solution should apply to all cases where different sides may need different borders.

1 Like
2

I’ve found the border property hard to work with.

I turned to creating a role I can then assign to any component.

below is an example of how I added a top and bottom border role.

.anvil-role-top_bottom_thin_border {
  border-top: thin solid;
  border-bottom: thin solid;
}
1 Like
3

I think the border property accepts the shorthand syntax ie

border: width style(required) color;

so if you want different border properties in one you will need a role as @anthonys suggests

1 Like