问题
I'm using DataTables.net + Twitter Bootstrap and the responsive layout, what I'm trying is to hide some columns of the table using the class "visible-desktop" thats shows the columns only in big sizes but It seems not to work, hides well but if I resize the windows to get a desktop width the columns hidden start showing stacked, seems a CSS display class problem, because inherits the type of display from the parent:
.visible-desktop {
display: inherit!important;
}
If I manipulate it to
.visible-desktop {
display: table-cell!important;
}
works well... Is there a workaround for this? Or I have to write my own class for table column hiding?
回答1:
Version 4
EDIT: Bootstrap 4 removed hidden and visible classes, see this answer for updated examples, and/or related official migration guide.
** Old Answer for Bootstrap 3 below **
Version 3
Available classes for .visible and .hidden.
Use a single or combination of the available classes for toggling content across viewport breakpoints.
From Bootstrap section here http://getbootstrap.com/css/#responsive-utilities-classes
回答2:
I finally found that exists a workaround replacing:
visible-desktop
by
hidden-phone hidden-tablet
Hope helps someone!
回答3:
On Boostrap 3.0 use .visibilty-<size> or .hidden-<size> responsive classes as described in the official doc.
http://getbootstrap.com/css/#responsive-utilities-classes
来源：https://stackoverflow.com/questions/16546267/twitter-bootstrap-responsive-show-table-column-only-on-desktop