chris
chris

Reputation: 36937

jQuery Datatables Header Alignment error Chrome/Safari

I appear to be having an issue of sorts with both Chrome and Safari with how the header column displays the titles when the browser is not maximized or full screen, or at a lower resolution. I can't find anything on the subject specifically so I am hoping someone here can throw me a bone.

Anyway heres a couple screenshots one from firefox on a low res, and one of chrome at a low res, and one of how ideally it should look despite size of window and res, but ideally Ill take the firefox one if at all possible.

The way I figure it is I think it may be the way Chrome and Safari handle padding along with text wrapping but I could be wrong. Either way I need a fix or a to find out if there is no work around

In Chrome:

Chrome

In Firefox:

Firefox

Nice to make it this way in all browsers:

Ideal

Upvotes: 0

Views: 1291

Answers (1)

Quasipickle
Quasipickle

Reputation: 4498

It looks like you've set your column widths really tight to how wide the text is. Increase the column width you've set.

Other than that, try setting whitespace:nowrap; on the header cells.

Upvotes: 2

Related Questions