Hiding/showing columns based on window size

Question

I was wondering if there was any way to make ngx-datatable columns visible/invisible based on the window size, similar to the bootstrap class hidden-xs to hide things on extra small screens.

add any class to your columns which you want to show hide as per device width then write media query for device width and write style for hide and show. `media only screen and (max-width:320px){.youclassname{display:none;}} /* this code hide your column in device which have 320px width and lower */` — Awesome Designer, Jun 14 '17 at 06:23

score 0 · Accepted Answer · answered Jun 14 '17 at 12:18

You can use a media query. Example: Assign class names to td of columns you wish to hide based on certain widths. Lets say you have a class name -- .768hidables -- you can define a css as below:

@media (max-width: 768px) {
     .768hidables {
         display:None;
     }
}

Hiding/showing columns based on window size

1 Answers1