Oracle Apex Interactive Report - cell background color

Question

Is it possible remove white space (padding) inside cell?

Query return cell background color like this:

Select
'<span style="background-color: #B8817D">' || col_1 || '</span>' as "1",
'<span style="background-color: #B8817D">' || col_2 || '</span>' as "2",
'<span style="background-color: #F7DC6F">' || col_3 || '</span>' as "3",
'<span style="background-color: #F7DC6F">' || col_4 || '</span>' as "4"
.....

Have you hit F12 and used the browser's Inspect function to look at the CSS yet? — Mark Stewart, Jul 20 '21 at 14:42

davidm · Accepted Answer · 2021-07-21T09:20:43.090

4

It requires a bit of hacking, but it should work.

First add this page level inline CSS:

.no-parent-padding {
    padding: 8px;
    margin: -12px -12px;
}

.yellow-background {
    background-clip: content-box;
    box-shadow: inset 0 0 0 12px yellow;
    background-color: yellow;
}

.brown-background {
    background-clip: content-box;
    box-shadow: inset 0 0 0 12px brown;
    background-color: brown;
}

Next the SELECT should look as follow:

select      
    '<div class="brown-background no-parent-padding">'|| 12 ||'</div>' AS "12",
    '<div class="yellow-background no-parent-padding">'|| 2 ||'</div>' AS "2"
....

Finally the result:

edited Jul 21 '21 at 09:20

answered Jul 21 '21 at 08:00

davidm

1,570
11
24

@Tnx for help but when have more columns it doesn't look like. https://postimg.cc/8jh7jh3J – user_odoo Jul 21 '21 at 09:07
1

Edited (the CSS).... Check it now. I told you it was hacking :P – davidm Jul 21 '21 at 09:21

score 0 · Answer 2 · answered Nov 08 '22 at 09:24

I'd like to reference to this clean solution from Kutub Tech: youtube – code to be found here

Steps:

Select desired Column > go to "Advanced" > set "Static ID" > set rep_col_diffcolor_1
(optional) Select another Column > go to "Advanced" > set "Static ID" > set rep_col_diffcolor_2
Select Page Root > go to "Inline" > paste the following

.a-IRR-table tr td[headers*="rep_col_diffcolor_1"] {
    background-color: #99ccff;
}
    
.a-IRR-table tr td[headers*="rep_col_diffcolor_2"] {
    background-color: #bfc4c9;
}

Oracle Apex Interactive Report - cell background color

2 Answers2