IT Blog

  • Blog
  • Technology
    • Technology
    • Architecture
    • CMS
    • CRM
    • Web
    • DotNET
    • Python
    • Database
    • BI
    • Program Language
  • Users
    • Login
    • Register
    • Forgot Password?
  • ENEN
    • 中文中文
    • ENEN
Experience IT
In a World of Technology, People Make the Difference.
  1. Home
  2. Technology
  3. Web
  4. JavaScript
  5. Fixing jQuery DataTables header non-responsive issue

Fixing jQuery DataTables header non-responsive issue

2018-10-24 2646 Views 0 Like 0 Comments

jQuery DataTables renders table into two parts: 

  • header, <div class="dataTables_scrollHeadInner"><div class="dataTable">
  • body, <div class="dataTables_scrollBody">

DataTables measures the current screen size and set the fixed width. In this case when resizing the browser, the table header and body are not resized automatically.

The solution is to enforce their width to be set in percentage. The following code is the final.

.dataTable,
.dataTables_scrollHeadInner,
.dataTables_scrollBody{
     width:100% !important;
}
datatable-non-responsive

Note: file: \WebSites\WebBusinessSuite\Scripts\Main\BusinessSuit.css

 9,354 total views,  4 views today

error
fb-share-icon
Tweet
fb-share-icon
IT Team
Author: IT Team

Tags: Bell Note
Last updated:2018-10-24

IT Team

This person is lazy and left nothing

Like
< Previous
Next >

Comments

Cancel reply
Chinese (Simplified) Chinese (Simplified) Chinese (Traditional) Chinese (Traditional) English English French French German German Japanese Japanese Korean Korean Russian Russian
Newest Hotspots Random
Newest Hotspots Random
Rich editor not working Making web page scroll down automatically Getting data from Dapper result All Unicode Chars How to keep and display contact form 7 data Common Regular Expressions
Jetpack conflict with Crelly Slider Emojis and icons for HTML Extract emails to MailChimp Duplicator - backup & restore Switch external image for index page and posts Crawling images from web with PHP
Categories
  • Architecture
  • BI
  • C#
  • CSS
  • Database
  • DotNET
  • Hosting
  • HTML
  • JavaScript
  • PHP
  • Program Language
  • Python
  • Security
  • SEO
  • Technology
  • Web
  • Wordpress

COPYRIGHT © 2021 Hostlike IT Blog. All rights reserved.

This site is supported by Hostlike.com