Rotan wrote:

 

The data consists of 'Total Records', 'Processed Records', 'Error Records'.

That would appear to be three elements, not four...

Assuming the data is sourced from three (or four) columns or expressions, here's how to do this using semantic mark-up and proper separation of concerns:

1. In the report source query, return null for the CARD_TEXT column value, and the data elements in separate columns:

select
    ...                     card_title
  , ...                     card_link                                        
  , null                    card_text
  , null                    card_subtext
  , coalesce(total, 0)      total
  , coalesce(processed, 0)  processed
  , coalesce(errors, 0)     errors
  ...

2. Set the CARD_TEXT column HTML Expression to

<dl>
  <dt>Total Records<dd>#TOTAL#
  <dt>Processed Records<dd>#PROCESSED#
  <dt>Error Records<dd>#ERRORS#
</dl>

3. Set the report template option Body Text to Auto.

4. Add a style sheet to the page Inline CSS property to position the terms and descriptions so they appear on the same line:

.t-Card-desc dt {  
  display: inline-block;  
  width: 8.65em;
}  
.t-Card-desc dd:before {
  content: ": ";
}
.t-Card-desc dd {  
  display: inline;  
  margin: 0;  
}  
.t-Card-desc dd:after {  
  display: block;  
  content: "";  
}