HTML/CSS issue (Summary# data showing on separate lines)
Did a lot of reading from previous posts about using HTML/CSS in Summary#'s and wanted to give it a try for a card, and while it looks great and provides a very effective quick view to determine lost time, can't seem to get this to display properly, i.e. on a single line (we wanted to make the lost time standout, using RED as the color).
Just wondering if another pair of eyes might be able to pickup on the issue in the HTML/CSS markup we're using that places the two metrics onto separate lines within the Summary# calculation? I'm pretty certain it has to do with the DIV's being used, possibly the placement, but can't seem to find another way to show the total time in RED without placing that within a second DIV which seems to be the culprit?
Any thoughts on updates to the markup for this? Thanks!
SUMMARY NUMBER:
CONCAT (
'<div style="font-size: 28px; width: 100%; height:100%; margin:-20px; padding:20px;">', CONCAT
(COUNT(CASE WHEN `Late By` <> '' THEN (SUBSTRING(`Late By`, 1, (INSTR(`Late By`, 'm')-1)) ) + SUBSTRING(`Late By`, (INSTR(`Late By`, 'm')+2), (INSTR(`Late By`, 's'))-(INSTR(`Late By`, 'm')+2)) / 60 ELSE 0 END), ' instances','
<div style="font-size: 20px; color: red;">
(', SUM(CASE WHEN `Late By` <> '' THEN (SUBSTRING(`Late By`, 1, (INSTR(`Late By`, 'm')-1)) ) + SUBSTRING(`Late By`, (INSTR(`Late By`, 'm')+2), (INSTR(`Late By`, 's'))-(INSTR(`Late By`, 'm')+2)) / 60 ELSE 0 END), ' minutes) ', '</div>','</div>'))
Best Answer
-
Stepped back a minute, and realized the issue - using another DIV within the markup when it should've been SPAN instead! Sorry for not seeing that before posting, my mistake.
CONCAT
(
'<div style="font-size: 28px; width: 100%; height:100%; margin:-20px; padding:20px;">',
CONCAT
(COUNT(CASE WHEN `Late By` <> '' THEN (SUBSTRING(`Late By`, 1, (INSTR(`Late By`, 'm')-1)) ) + SUBSTRING(`Late By`, (INSTR(`Late By`, 'm')+2), (INSTR(`Late By`, 's'))-(INSTR(`Late By`, 'm')+2)) / 60 ELSE 0 END), ' instances',
'<span style="font-size: 20px; color: red;">
(', SUM(CASE WHEN `Late By` <> '' THEN (SUBSTRING(`Late By`, 1, (INSTR(`Late By`, 'm')-1)) ) + SUBSTRING(`Late By`, (INSTR(`Late By`, 'm')+2), (INSTR(`Late By`, 's'))-(INSTR(`Late By`, 'm')+2)) / 60 ELSE 0 END), ' minutes)' ,'</span>',
'</div>')
)1
Answers
-
Stepped back a minute, and realized the issue - using another DIV within the markup when it should've been SPAN instead! Sorry for not seeing that before posting, my mistake.
CONCAT
(
'<div style="font-size: 28px; width: 100%; height:100%; margin:-20px; padding:20px;">',
CONCAT
(COUNT(CASE WHEN `Late By` <> '' THEN (SUBSTRING(`Late By`, 1, (INSTR(`Late By`, 'm')-1)) ) + SUBSTRING(`Late By`, (INSTR(`Late By`, 'm')+2), (INSTR(`Late By`, 's'))-(INSTR(`Late By`, 'm')+2)) / 60 ELSE 0 END), ' instances',
'<span style="font-size: 20px; color: red;">
(', SUM(CASE WHEN `Late By` <> '' THEN (SUBSTRING(`Late By`, 1, (INSTR(`Late By`, 'm')-1)) ) + SUBSTRING(`Late By`, (INSTR(`Late By`, 'm')+2), (INSTR(`Late By`, 's'))-(INSTR(`Late By`, 'm')+2)) / 60 ELSE 0 END), ' minutes)' ,'</span>',
'</div>')
)1
Categories
- All Categories
- 1.8K Product Ideas
- 1.8K Ideas Exchange
- 1.6K Connect
- 1.2K Connectors
- 300 Workbench
- 6 Cloud Amplifier
- 9 Federated
- 2.9K Transform
- 102 SQL DataFlows
- 626 Datasets
- 2.2K Magic ETL
- 3.9K Visualize
- 2.5K Charting
- 753 Beast Mode
- 61 App Studio
- 41 Variables
- 692 Automate
- 177 Apps
- 456 APIs & Domo Developer
- 49 Workflows
- 10 DomoAI
- 38 Predict
- 16 Jupyter Workspaces
- 22 R & Python Tiles
- 398 Distribute
- 115 Domo Everywhere
- 276 Scheduled Reports
- 7 Software Integrations
- 130 Manage
- 127 Governance & Security
- 8 Domo Community Gallery
- 38 Product Releases
- 11 Domo University
- 5.4K Community Forums
- 40 Getting Started
- 30 Community Member Introductions
- 110 Community Announcements
- 4.8K Archive