To build a semantic <dl><dt><dd> description list in ODC and still be able to style it, use HTML Element widgets for the tags and apply classes via their Attributes property (not Style Classes).

OutSystems doesn’t ship a dedicated “Description List” widget; the way to do it is:

1. Outer container (optional)

   • Drag a Container or Div widget to the screen.
   • Set Style Classes to something like:
     description-list-wrapper

2. <dl> element

   • Drag an HTML Element widget inside the container.
   • Set Tag to dl. List & HTML Widgets
   • In Attributes, add:
     • Name: class
       Value: "description-list"
       (or an expression like If(IsSomething, "description-list highlighted", "description-list"))

3. Each item (<div><dt><dd></div>) For each “row” (Name, Gender, etc.):

   • Inside the dl HTML Element, drag a Container or Div widget (this will be your <div> wrapper).

     • Give it an optional Style Classes: description-item.

   • Inside that container:

     1. <dt>

        • Drag an HTML Element widget.
        • Set Tag to dt.
        • Inside it, place a Text widget: for example "Name".
        • (Optional) In Attributes, set class with a value like "description-term".

     2. <dd>

        • Drag another HTML Element widget.
        • Set Tag to dd.
        • Inside it, place a Text widget or expression: e.g. Person.Name.
        • (Optional) In Attributes, set class with a value like "description-detail".

4. Styling

   • Put your CSS in the theme or the screen’s stylesheet, e.g.:

     .description-list {
       margin: 0;
       padding: 0;
     }
     
     .description-item {
       display: flex;
       gap: 8px;
       margin-bottom: 4px;
     }
     
     .description-term {
       font-weight: 600;
       min-width: 120px;
     }
     
     .description-detail {
       color: #666;
     }
     

Key point:
The HTML Element widget does not use Style Classes, but you can assign CSS classes by adding a class attribute in its Attributes property. That’s the supported way to style custom tags like dl, dt, and dd. Using styles