Is it possible to target specific dt-button-collection dropdowns in css ?
Is it possible to target specific dt-button-collection dropdowns in css ?
https://jsfiddle.net/gouldner/zb0cd63m/
This example has three dt-button-collections so when I make one of them wider they all get wider which is not what I want.
The three in this example are
1. StateRestore - which I want to make wider and keep the drop down below the button.
2. ColumnVisibility - which I don't want to be wider and I want to display on top of the button not below since the button is on the bottom of the page
3. PDF Print Option - which like ColumnVisibility I want to NOT be wider, and I want to display above the button not below.
Col-Vis adds a unique class to the buttons only not the collection. Namely buttons-columnVisibility. It would be nice if StateRestore did this also and it would be useful if each of the collections could have their own class.
Is there a way to add classes to these when I extend them ?
This question has an accepted answers - jump to answer
Answers
Hi @desperado ,
Yes you can use the
buttons.buttons.classNameinitialisation property to set a class name on a button.I don't think there is currently a way to set a class on the
dt-button-collectiondivs, but I will ask Allan when he gets in and respond back here.Thanks,
Sandy
You could (mis)use the
collectionLayoutoption for the collection button. It basically just adds a class to the.dt-button-collectionelement. We have a few pre-set options for it in our CSS, but you could actually use any string you want for it.Allan