@hidden column -> overflow-x visible scrollbar

Sveno

Hi,

i have a table in a bootstrap #div.table-responsive and its works fine.

now i have add a hidden column in my table and now i have a visible horizontal scrollbar at my table

div.table-responsive has a width of 1140px

datatables_wrapper has a width of 1140px, too

it is a bug?

Sveno

table#datatables has a inline width of 1142px

thats the problem.... but how is the solution?

my "quickfix"

#datatables {
  margin: -1px;
}

allan

Can you link to a page showing the issue pelase?

Also, try running the debugger on your page and run the "Common issues" tests.

Allan

Sveno

Morning Allan,

"common issues" -> 15 tests complete. No failures or warnings found!

Upload configuration data -> https://debug.datatables.net/ukotef

The Website is a closed beta project... i send you a temp Login @ private message

allan

If you could that would be great - send me a PM by clicking my name above and then the "Send message" button.

Are you using columns.visible to hide the column?

Allan

Sveno

PM is send.
i use this code

        "columnDefs": [
          { "targets": "hideThisRow", "visible": false }          
        ],

with the classname "hideThisRow" i handle my hidden columns

i uses sometimes hidden columns for secret ordering

allan

Could you try changing:

<table class="table table-striped" id="datatables">

To be:

 <table class="table table-striped" id="datatables" style="width:100%">

please? Hopefully that will do it.

Allan

Sveno

yes it do it and works...

but what is the reason, that at hidden columns the width isnt correct?

#datatables {
  width: 100% !important;
}

allan

Its very difficult in Javascript to get a percentage width from a stylesheet, but getting it from the style attribute or width="100%" on the table tag is easy. So DataTables looks for that and will perform a few extra calculations to make sure the table stays at 100% width.

Allan

Sveno

ok, thx for the fix