Using Bootstrap 3 how can I hide columns in my table?

Question

I\'m trying to hide columns for my responsive design when in col-xs and col-sm. I first attempted to use hidden-xs/hidden-sm classes, but

Answer 1

I recently run into a similar issue, working on displaying a table differently, depending on screen size. The task for me was to hide one column when on a bigger screen and show it on a mobile device while hiding three other columns (the 'one' column is the sum of data in the 'three' columns. Like the response above, I used a media query, but disposed of bootstrap's pre-made views altogether. I added classes to the th and td tags involved.

Looks very much like this:

.full_view {
width: 50px;
  @media(max-width: 768px){
    display: none;
  }
}

.small_view {
  width: 50px;
  @media(min-width: 768px){
    display: none;
  }
}