Divider between Editor's button and other buttons.

Divider between Editor's button and other buttons.

luisrortegaluisrortega Posts: 79Questions: 6Answers: 1
edited January 2014 in TableTools
Hi,

I'm currently using the editor and just implemented copy, csv, and pdf buttons out of TableTools... Is there a way I can split (add a space between the New, Edit, Delete (from Editors) and the Copy, CSV, and PDF?

[code]
"oTableTools": {
"sRowSelect": "single",
"aButtons": [
{ "sExtends": "editor_create", "editor": ItemEditor },
{ "sExtends": "editor_edit", "editor": ItemEditor },
{ "sExtends": "editor_remove", "editor": ItemEditor },
// I'll like to add a space here! :)
"copy","csv","pdf",
]
},//oTableTools
[/code]

Replies

  • allanallan Posts: 57,236Questions: 1Answers: 9,113 Site admin
    Add a class to the remove button using the "sButtonClass" option ( http://datatables.net/extras/tabletools/button_options#sButtonClass ) and then simply use a little bit of CSS, targeting that class, to add right margin to the button, thus creating a space.

    Allan
  • luisrortegaluisrortega Posts: 79Questions: 6Answers: 1
    That worked perfect! strange enough I could't not use margin-left because it seems to be overritten by another css class... but margin-right work perfectly (on previous button)

    Tks!
  • luisrortegaluisrortega Posts: 79Questions: 6Answers: 1
    [code]
    //css
    .my_button_space_class{
    margin-right :20px;
    }
    //javascript
    "aButtons": [
    { "sExtends": "editor_create", "editor": ItemEditor },
    { "sExtends": "editor_edit", "editor": ItemEditor },
    { "sExtends": "editor_remove", "editor": ItemEditor , "sButtonClass": "my_button_space_class"},
    "copy","csv","pdf"
    ]
    [/code]
This discussion has been closed.