# Visual break between widgets

**URL:** <https://discourse.openondemand.org/t/visual-break-between-widgets/3078>\
**Category:** Get Help\
**Created:** [November 3, 2023, 11:12pm UTC](https://discourse.openondemand.org/t/visual-break-between-widgets/3078 "2023-11-03T23:12:52Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![griznog](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/griznog/32/39_2.png) [@griznog](https://discourse.openondemand.org/u/griznog)\
**Post date:** [November 3, 2023, 11:12pm UTC](https://discourse.openondemand.org/t/visual-break-between-widgets/3078/1 "2023-11-03T23:12:52Z")

</div>

I think the answer to this is probably “change the css and use javascript to …” but I’m hoping I’ve overlooked a simpler way. What’s the best/simplest way to add some kind of visual break between widgets? They all kind of blur together, which maybe only I notice because I’m debugging and have eye strain from reloading the apps pages. A simple

* * *
 between them would suffice, really, but I don’t see an obvious way to get that into the page via the form.yml.erb file.

---

<div class="post-metadata">

**Author:** ![jeff.ohrstrom](https://sea1.discourse-cdn.com/flex015/user_avatar/discourse.openondemand.org/jeff.ohrstrom/32/136_2.png) [@jeff.ohrstrom](https://discourse.openondemand.org/u/jeff.ohrstrom)\
**Post date:** [November 6, 2023, 9:26pm UTC](https://discourse.openondemand.org/t/visual-break-between-widgets/3078/2 "2023-11-06T21:26:37Z")

</div>

You can add css classes to form widgets.

With this definition (`mb-5` being margin for bottom 5 bootstrap class)

```auto
attributes:
  seperator:
    widget: number_field
    class: 'mb-5'

```

gives me this, with all the space below it.

 ![image](https://us1.discourse-cdn.com/flex015/uploads/osc/original/2X/3/3e31d01f7c0c2b8937380a26fddbd673ee576dfd.png)

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex015/uploads/osc/original/2X/b/bae70bd0ed39a3ae769c2108155f4cb3e9da8385.png) [@system](https://discourse.openondemand.org/u/system)\
**Post date:** [May 4, 2024, 9:27pm UTC](https://discourse.openondemand.org/t/visual-break-between-widgets/3078/3 "2024-05-04T21:27:26Z")

</div>

Closed on May 4, 2024, 9:27pm UTC

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