dataTables-wrapper width

dataTables-wrapper width

JochenKJochenK Posts: 14Questions: 1Answers: 0

Hey there,
How can I control the width of the dataTables_wrapper?? It sets itself to 100% regardless ( max 1020px) , and I'd really like it to set itself to an width around 120 0px. Any ideas?

Thanks a lot
Jochen

This question has an accepted answers - jump to answer

Answers

  • colincolin Posts: 10,503Questions: 0Answers: 1,773

    We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

    Cheers,

    Colin

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    Colin,
    i make a test case live.datatables.net/lopevege/1/edithttp://

    The table should be responsive with fixedColum.
    Please try the pagination numbers and you will see that x-scrollbar by different numbers disappears.

    Furthermore, I would like to expand the table in width, so that the middle row area ( color:lavender ) is filled.
    Is there a solution?

    Cheers, Jochen

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    Colin,
    Another addendum to the previous text:
    When I used "table-bordered" in the table tag, pagination works fine,but the first column on the left gets its own scrollbar.

  • colincolin Posts: 10,503Questions: 0Answers: 1,773

    The table isn't initialising. There are no errors, but something isn't right - could you take a look, please,

    Colin

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    Hmmm...take a look ....ok, but i can't find an error. I have no idea what could be wrong!
    I have tried with newest Firefox and IE.

    http://live.datatables.net/lopevege/1/edit

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    Hi Colin,
    it seems that i found a workaround:
    the js-file "dataTables.responsive.min.js" make the trouble, if this file is not used everything looks fine.
    That is not the solution because the table is now not responsive. How is this to be solved now?
    And the another problem is:
    When I used "table-bordered" in the table tag the first column on the left gets its own second scrollbar.

  • JochenKJochenK Posts: 14Questions: 1Answers: 0
  • allanallan Posts: 53,082Questions: 1Answers: 8,177 Site admin

    In that link, there is the following CSS:

        div.dataTables_wrapper {
            width: 900px;
            margin: 0 auto;
        }
    

    So the table won't be dynamic in width, it will just be 900px. You could use max-width: 900px if you didn't want it wider than that.

    Allan

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    I have used know max-width and the responsive-problem is solved .... thanks.
    But what about table-bordered? Is it not possible tu use with fixedColumns?

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    In the responsive-examples here I see that the columns are responsive. It is possible that fixedColumns with responsive doesn't work ? in the test case i have set all necessary responsive-options. http://live.datatables.net/lopevege/5/edit

  • colincolin Posts: 10,503Questions: 0Answers: 1,773

    Yep, FixedColumn extension and Responsive are incompatible I'm afraid - see the compatibility matrix here,

    Colin

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    Hmm.... i see ... ok, but that is very unfortunate.
    And it is known, that table-bordered doesn't work with fixedColumns?

    Thanks for yourhelp

  • colincolin Posts: 10,503Questions: 0Answers: 1,773

    Yep, they should work - see here: http://live.datatables.net/sodukama/1/edit

    Colin

  • colincolin Posts: 10,503Questions: 0Answers: 1,773

    p.s. and sorry about not picking up on that incompatibility in your earlier posts in this thread, I totally missed that.

  • colincolin Posts: 10,503Questions: 0Answers: 1,773
    Answer ✓

    And please ignore the example in that top comment, the bin is corrupted, please go here instead: http://live.datatables.net/pegageji/1/edit

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    ok..thanks for your help ...for my first problem fixedCoumns / responsive i try to find another solution for my work.

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    if i want to change the color of the fixedColumn can i do this in the fixedcolumns.css or is it only possible with a function?

  • colincolin Posts: 10,503Questions: 0Answers: 1,773

    You can modify your project's CSS, something like this: http://live.datatables.net/pegageji/3/edit

    Colin

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    Thanks, this is a great help for me. Are the possibilities described somewhere in a referenz manual ( i can't find any here ) to use css-tags, for example _DTFC* or when i have <a href.... in the fixedColumn and that href shout be change color when hover it ?

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    For information : I noticed that I have to use !important in css in my program environment, otherwise the color will not be changed

    .DTFC_Cloned td {
    background-color: #58ACFA !important;
    }

  • colincolin Posts: 10,503Questions: 0Answers: 1,773

    Not documented, as that's standard CSS stuff. Glad all working!

    Colin

  • JochenKJochenK Posts: 14Questions: 1Answers: 0

    Smile ... you are right..it's CSS standard, i know. But i think that CSS-Tag .DTFC_cloned is part of any CSS-File and that is what i mean.
    But ok..i will try to find

    Thanks for your help so far, has been very insightful.

Sign In or Register to comment.