How to style Button CSS

duttakirtiman

Hi! Even if i try modifying the button colours to "background-color: solid #5cb85c !important;". My colours still gets displayed as grey only. Can anyone tell me which classes do i need to change in my Css file so that i get the colour that i want?

kthorngren

Here are two of many threads with this question:
https://datatables.net/forums/discussion/67611/change-buttons-color
https://datatables.net/forums/discussion/42516/color-button

If these don't help then please provide a link to your page or a test case showing the issue so we can help debug.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin

duttakirtiman

Hi Kevin,

Hope your day is going well. The mentioned solutions are not working for me.
Please notice the changes that i have made for my css.

http://live.datatables.net/waheyeze/1/

Here is the link for the test case

duttakirtiman

![](https://datatables.net/forums/uploads/editor/xz/izq1itsad9dc.png ""

See the background color option is been striked out. But if i try to inspect and add the background property value manually, it works there. My screenshot justifies it

kthorngren

I see you want to change the paging buttons. I assumed you were asking about the Buttons extension.

Did you make modifications to the CSS you copied into the test case? I would suggest not updating the CSS file directly and just override the CSS. This way if you upgrade you won't lose your changes.

Take a look at Allan's example in this thread. See if just adding that CSS to your page works.

Kevin

duttakirtiman

Hey, i visited the adding a buttons.buttons.className . I have 2 questions,
1. mine are basic buttons with no additionaility such as copy, excel etc. How do i write it in the js section?
2. If i cant modify the main css, where do i modify it?

kthorngren

1. mine are basic buttons with no additionaility such as copy, excel etc. How do i write it in the js section?

See this example.

And use the extend keyword to define the button, like this example.

1. If i cant modify the main css, where do i modify it?

Not sure what you mean by main css but if you are asking about overriding the Datatables CSS just use the style tag to apply the CSS.

Kevin

duttakirtiman

Thanks Kevin. It worked