oracleoracle-apexoracle-apex-18.2oracle-apex-19.2

Oracle Apex Interactive Report - cell background color


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"
.....

enter image description here


Solution

  • 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: enter image description here