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 2888 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

Loading

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
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
Data visualization with Flask Install sample data for Dynamic 365 trial Restoring the Links Manager Query menu in WordPress Send report in the attachment from database Python Data Visualization Practise
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