Product Exp
Product Exp

Reputation: 35

Tabulator table specific styling

I have 3 tabulator tables in a single HTML page. I want to add a custom class with a specific styling or add a custom styling. E.g.

overflow-x: hidden

to one table and not affecting others. How can I do that without changing any default styling of other tables on the same page?

Upvotes: 1

Views: 2136

Answers (3)

Oli Folkerd
Oli Folkerd

Reputation: 8398

The above examples are correct, you just need to apply the ID or class to the div holding the table instead so it would be:

HTML

<div id="table-1"></div>

JS

var table = new Tabulator("#table-1",{...});

CSS

#table-1{
    ///your styles here
}

Though i would be wary about changing properties like overflow on the table element, they will likely result in unexpected behaviour.

Upvotes: 2

Namdev
Namdev

Reputation: 214

just add unique class to table tag in which you want to apply style.

<table class="custom-table">
   <table>
      <table>
      </table>
   </table>
</table>

css

.custom-table {
   overflow-x:hidden;
}

Upvotes: 0

Muhammad Zeeshan
Muhammad Zeeshan

Reputation: 4748

You can give that table an id and apply the style to the id. You can do something like:

style.css

#custom_table{
 overflow-x: hidden;
}

index.html

<table id="custom_table"></table>

Hope this works for you.

Upvotes: 0

Related Questions