Divider Color

How does one control the color of a divider on an individual basis. I can see how to override the color globally with a class override but no way of setting the color for an individual divider independent of the global color?

Hi @handshaper

Here’s a few ways to do it.
Using a regular divider brick and with a html/code widget.

Here’s the codes used in the video.

<hr class="hr-blue" style="border-top:2px dotted; width:75%; height:20px; margin-top:10px;">

<hr class="hr-red" style="border-top:2px dashed; width:75%; height:20px; margin-top:10px;">

<hr class="hr-blue" style="border: 2px dashed; width:75%">

Replace “dashed” or “dotted” with “solid” to get the regular solid line.

Cheers / Johny


Awesome, got it working using the custom class approach. I had tried this before but because I had overridden the color for the divider class it was not allowing me to customize the color. All good now! Thanks!

1 Like