Support » Plugin: EZ SQL Reports Shortcode Widget and DB Backup » Suppressing table borders

  • Resolved hendosdad

    (@hendosdad)


    Firstly, excellent plugin. Thank you.

    I’m trying to prevent the report name showing, to stop the header row showing and to stop the table borders showing.

    I’ve placed the following code on the page concerned, using the text editor.

    <style>
    .ELISQLREPORTS-Report-Name {display: none;}
    .ELISQLREPORTS-Header-Row {display: none;}
    .ELISQLREPORTS-table td {border: 0px;}>
    </style>

    The only override that doesn’t work is that the top and the left borders for the table still show. All the other borders disappear.

    I’ve used ‘border: none’ and ‘border: 0px’ without success.

    Any suggestions.

Viewing 5 replies - 1 through 5 (of 5 total)
  • Plugin Author Eli

    (@scheeeli)

    This only removes the orders on the TD tags:
    .ELISQLREPORTS-table td {border: 0px;}

    You also need this to remove the border on the table:
    .ELISQLREPORTS-table {border: 0px;}

    Thank you.

    Is there a post somewhere of all the overrides that can be used?

    Plugin Author Eli

    (@scheeeli)

    Even if you are only asking about the possible way to override certain styles in CSS, there are still so possibilities that I can’t begin to document every possible way you might be able to override any particular style.

    I think you’ve got some basic examples, but with the whole CSS language at your disposal you could really alter almost anyaspect of the the HTML on you page. So the better question would be: what else would you like to override or affect?

    Sorry for the ambiguity in my post.

    I am interested in finding out if there were any other classes in your plugin that can be overriden using <style> … </style>. So far I’ve stumbled on the following:

    .ELISQLREPORTS-Report-Name {display: none;}
    .ELISQLREPORTS-Header-Row {display: none;}
    .ELISQLREPORTS-Odd-Row {background-color: #FFFFFF;}
    .ELISQLREPORTS-Even-Row {background-color: #FFFFFF;}
    .ELISQLREPORTS-table {border: 0px;}
    .ELISQLREPORTS-table td {border: 0px; padding: 0px;}

    …and am wondering if there are any more.

    (In case you’re wondering, the Odd-Row and Even-Row overrides also stopped the top and LH borders showing.)

    Plugin Author Eli

    (@scheeeli)

    Here is an HTML sample of a simple report which shows all the classes used by my plugin:
    <div id="my-report" class="ELISQLREPORTS-Report-DIV" style="overflow: auto;"><h2 class="ELISQLREPORTS-Report-Name">My Report</h2><table border="1" cellspacing="0" cellpadding="4" class="ELISQLREPORTS-table"><thead><tr class="ELISQLREPORTS-Header-Row"><th><b>COLUMN</b></th></tr></thead><tbody><tr class="ELISQLREPORTS-Row-0 ELISQLREPORTS-Even-Row"><td>CELL</td></tr></tbody></table></div>

    Here are all those classes:

    • ELISQLREPORTS-Report-DIV
    • ELISQLREPORTS-Report-Name
    • ELISQLREPORTS-table
    • ELISQLREPORTS-Header-Row
    • ELISQLREPORTS-Row-0 (ELISQLREPORTS-Row-1, 2, 3, Etc.)
    • ELISQLREPORTS-Even-Row
    • ELISQLREPORTS-Odd-Row

    Now you can apply literally any valid CSS code to any of these classes (or any other element on the page, for that matter).

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Suppressing table borders’ is closed to new replies.