CSS issue

propolis

Hi,

On my site the number of pages box and search box has changed from the design. This is what it should look like using tabulizer wizard

.
.
.

But when I put it into my site this is what it actually looks like

.
.
.

The tabulizer developer made the following comment which means nothing to me:

This issue is related to the fact that your site is using the theme CSS files, which also affect the appearance of the table.

In other words, the styling of your table is the combination of the CSS statements found in the ruleset's CSS file and the Joomla's template CSS files.

If you want to change the appearance, you will need to edit manually the ruleset's CSS file

.
.
.

This is the code I was given that needs modifying but how does this relate to the template to get the correct appearance as in the first image and not break the template:

table.tabtable-rsp65ypbrq, table.tabtable-rsp65ypbrq tr td.tabcol { border: none; }
table.tabtable-rsp65ypbrq tr { border-width: 1px;
border-color: #dddddd;
border-style: solid; border-left: none; border-right: none; }
table.tabtable-rsp65ypbrq tr.tabrow.tabrow td.colwidth1 { width: 10%; }
table.tabtable-rsp65ypbrq tr.tabrow.tabrow td.colwidth2 { width: 15%; }
table.tabtable-rsp65ypbrq tr.tabrow.tabrow td.colwidth3 { width: 15%; }
table.tabtable-rsp65ypbrq tr.tabrow.tabrow td.colwidth4 { width: 30%; }
table.tabtable-rsp65ypbrq tr.tabrow.tabrow td.colwidth5 { width: 30%; }
table.tabtable-rsp65ypbrq {
border-collapse:collapse;width:100%;background-color: transparent;}
table.tabtable-rsp65ypbrq tr.tabrow td.tabcol {
font-style: normal;font-weight: normal;padding: 5px;background-color: transparent;}
table.tabtable-rsp65ypbrq tr:nth-child(even) td.tabcol, table.tabtable-rsp65ypbrq tr:nth-child(even) td {
font-style: normal;font-weight: normal;background-color:#fafafa;}
table.tabtable-rsp65ypbrq tr.trht1 td.tabcol, table.tabtable-rsp65ypbrq tr.trht1:hover td.tabcol, table.tabtable-rsp65ypbrq tr.trht1 td.tabcol:hover {
font-size: 20px;font-style: normal;font-weight: bold;color: #c36349;background-color: transparent;}

.
.
.

Thank you for any suggestions

Eddie

saguaros

Hi Eddie,

You can make a simple test by assigning that page to default Joomla template and see how it goes.

I tried to log into backend of your site but the provided account doesn't work, kindly check again.

propolis

saguaros

Hi,

See attached when using normal template. Looks fine then.
.

.
So I want the layout from the above image layout for show entries and search to work on my current site template
.

Also, login should work now
.

Thanks

Eddie

saguaros

Hi Eddie,

It has conflict in style with style of template. I added this custom css into the custom.css file in template:

/* Tabulizer*/

div.dataTables_wrapper select, div.dataTables_filter input {
    display: inline-block;
}

Kindly check.

propolis

saguaros

Looks good.

Is there anyway to make the boxes height 24px

Eddie

saguaros

You can use this CSS rule:

div.dataTables_filter input {
    height: 24px;
}

div.dataTables_wrapper select {
    padding-top: 1px;
    padding-bottom: 1px;
}

propolis

saguaros

Thank you for helping.

Works fine

Eddoe