1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

XF 1.2 Hiding a table column in responsive

Discussion in 'Styling and Customization Questions' started by Andy.N, Dec 12, 2013.

  1. Andy.N

    Andy.N Well-Known Member

    I have a html table on XF page and I would like to make the table responsive by hiding a whole column when in responsive @maxResponsiveNarrowWidth
     
  2. Jeremy

    Jeremy XenForo Moderator Staff Member

    Use @Brogan's resource on media queries.
    Code:
    table tr td:nth-child(x) {
      display: none
    }
     
    Andy.N likes this.
  3. Andy.N

    Andy.N Well-Known Member

    Thanks very much.
    Just for the record, I use this in extra.css to hide the 4th column of a table.
    Code:
    @media (max-width:@maxResponsiveNarrowWidth)
    {
    table tr td:nth-child(4) {
      display: none
    }
    
    table tr th:nth-child(4) {
      display: none
    }
    }
     

Share This Page