--- title: Add a Divider with the Rich Content Editor description: Add a horizontal Divider into your canvas to visually separate elements or highlight important sections. locale: en-US canonical_url: https://www.servicenow.com/docs/r/australia/employee-service-management/employee-experience-foundation/ec-rich-content-divider.html release: australia product: Employee Experience Foundation classification: employee-experience-foundation topic_type: task last_updated: "2026-03-12" reading_time_minutes: 2 breadcrumb: [Microsites, Creating employee communications, Authoring and managing employee communications, Employee Center Pro, Unified Employee Experience, Employee Service Management] --- # Add a Divider with the Rich Content Editor Add a horizontal Divider into your canvas to visually separate elements or highlight important sections. ## Before you begin Role required: sn\_cd.content\_manager Fill in the New content form fields. See [Create rich content](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/employee-service-management/employee-experience-foundation/ec-content-library-portal-rich-content.md) Create the page layout using modules or columns. - Modules are predefined content layouts comprised of header, paragraph text, and images. See [Add predefined content layouts with the Rich Content Editor](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/employee-service-management/employee-experience-foundation/add-modules-rich-content-editor.md) - Columns are containers that enable you to define a custom layout. See [Add columns with the Rich Content Editor](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/employee-service-management/employee-experience-foundation/ec-rich-content-canvas.md) ## Procedure 1. Navigate to the canvas by selecting the **Open editor** button from the **Design** tab of the **New content** form. 2. From the **Rich Content Editor** canvas, you can use a drag-and-drop method to add dividers. 3. Navigate to **Settings** tab. 4. Use any of the following styling settings:
| Settings field | Description |
|---|---|
| Styling | |
| Background Color | Use the color picker \(grey square\) to select a color or enter the color code that represents the background color you want to appear.All HTML colors are supported. For more information, see [HTML color names](https://htmlcolorcodes.com/color-picker/). |
| Advanced styling | |
| Width | Specify the value by entering a number.Select the unit of measure: - px: pixel - %: percentage |
| Height | Specify the value by entering a number.Select the unit of measure: - px: pixel - %: percentage |
| Margin | Margin is the space between the divider and another element/the canvas boundary. Specify the value for top, bottom, right, or left padding by entering a number. |
| Properties | |
| ID | A unique ID that identifies the HTML element. |
| Title | A tool tip or information that appears when a user hovers over the component. |