Title: Breaks existing CSS
Last modified: December 3, 2018

---

# Breaks existing CSS

 *  Resolved [airmuseumnet](https://wordpress.org/support/users/airmuseumnet/)
 * (@airmuseumnet)
 * [7 years, 6 months ago](https://wordpress.org/support/topic/breaks-existing-css/)
 * The sorter seems to work well but it broke my existing CSS. Oddly enough I an
   creating tables very similar to you color table sample but when I add the shortcode
   it breaks my cell width in my header cells.
 * Also, just like your example, the color swatch cell is not sortable. Is there
   a way to remove the sort option from that column?
 * Page with correct CSS: [https://aerorelics.com/federal-standard-colors-2000/](https://aerorelics.com/federal-standard-colors-2000/)
   
   Page with broken CSS: [https://aerorelics.com/federal-standard-colors/](https://aerorelics.com/federal-standard-colors/)
 * Thanks!!!
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fbreaks-existing-css%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 1 replies (of 1 total)

 *  Plugin Author [buntegiraffe](https://wordpress.org/support/users/buntegiraffe/)
 * (@buntegiraffe)
 * [7 years, 6 months ago](https://wordpress.org/support/topic/breaks-existing-css/#post-10943083)
 * Hello [@airmuseumnet](https://wordpress.org/support/users/airmuseumnet/),
 * Thanks for using our plugin.
 * There are 2 different issues here:
    1. We do not allow multiple header rows and
   style table with our own stylesheet to ensure responsive design (like display
   on tablet and mobile devices). 2. A conflict with your theme’s stylesheet.
 * To fix both issues, please try to add the following CSS rules to your stylesheet:
 *     ```
       td.colorsSwatch, th.colorsCenter:nth-of-type(2) {
           width:100px !important;
       }
       td.colorsSwatch {
           height: 60px;
       }
       div.dataTables_wrapper {
           max-width: 580px;
       }
       div.dataTables_wrapper select.input-sm {
           height:38px !important;
       }
       li.paginate_button::before {
          content: '' !important;
       }
       li.paginate_button {
           padding-left: 0 !important; 
       }
       ```
   
 * Please let me know if this resolved your issues.
 * Best regards
    -  This reply was modified 7 years, 6 months ago by [buntegiraffe](https://wordpress.org/support/users/buntegiraffe/).

Viewing 1 replies (of 1 total)

The topic ‘Breaks existing CSS’ is closed to new replies.

 * ![](https://ps.w.org/sort-any-table/assets/icon-256x256.jpg?rev=1616949)
 * [Sort ANY Table](https://wordpress.org/plugins/sort-any-table/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/sort-any-table/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/sort-any-table/)
 * [Active Topics](https://wordpress.org/support/plugin/sort-any-table/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/sort-any-table/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/sort-any-table/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [sort](https://wordpress.org/support/topic-tag/sort/)

 * 1 reply
 * 2 participants
 * Last reply from: [buntegiraffe](https://wordpress.org/support/users/buntegiraffe/)
 * Last activity: [7 years, 6 months ago](https://wordpress.org/support/topic/breaks-existing-css/#post-10943083)
 * Status: resolved