解决BootstrapTable设置height属性后,表格不对齐的问题

2018年03月06日 09:56:54 nb7474 阅读数 5920

 
 

一般在使用BootstrapTable 插件的时候,我是不固定高度的,没有height属性时候的插件一切正常,表格对齐也没有问题。但是为了将页面撑开,使数据少的时候,页面不显得空荡,所以就固定了高度:

height: $(window).height()*0.79,
  • 1

根据页面的大小进行动态变化。此时就会出现表格不对齐的现象,解决方法:

打开bootstrap-table.js 找到 BootstrapTable.prototype.resetView方法,找到如下代码:

if (this.options.showHeader && this.options.height) {
this.$tableHeader.show();
//注释掉下面两行 取消表头初始化解决表头和内容不对齐问题
//this.resetHeader();
//padding += this.$header.outerHeight();
}
 

一般在使用BootstrapTable 插件的时候,我是不固定高度的,没有height属性时候的插件一切正常,表格对齐也没有问题。但是为了将页面撑开,使数据少的时候,页面不显得空荡,所以就固定了高度:

height: $(window).height()*0.79,
  • 1

根据页面的大小进行动态变化。此时就会出现表格不对齐的现象,解决方法:

打开bootstrap-table.js 找到 BootstrapTable.prototype.resetView方法,找到如下代码:

if (this.options.showHeader && this.options.height) {
this.$tableHeader.show();
//注释掉下面两行 取消表头初始化解决表头和内容不对齐问题
//this.resetHeader();
//padding += this.$header.outerHeight();
}

解决BootstrapTable设置height属性后,表格不对齐的问题的更多相关文章

  1. ComboBox控件“设置 DataSource 属性后无法修改项集合”的解决【转】

    编写Winform程序,遇到comboBox的绑定事件和索引项变更事件的冲突问题,就是“设置 DataSource 属性后无法修改项集合”的错误问题,网上查了很多,大多说在索引项变更是进行非空判断,还 ...

  2. C# LIstbox 解决WinForm下ListBox控件“设置DataSource属性后无法修改项集合”的问题

    解决WinForm下ListBox控件“设置DataSource属性后无法修改项集合”的问题 分类: winform2008-05-24 02:33 2592人阅读 评论(11) 收藏 举报 winf ...

  3. 解决WinForm下ListBox控件“设置DataSource属性后无法修改项集合”

    解决WinForm下ListBox控件“设置DataSource属性后无法修改项集合” 最近更新: 2013-2-15    587   很少写WinForm程序第一次使用ListBox控件就遇到了比 ...

  4. Delphi中Menu设置Images属性后快捷按键下划线被隐藏解决方法

    现象:MainMenu设置Images属性后,看不到快捷按键的下划线,如:新建(&N) 分析:VCL中Menus.pas单元的代码,看到如下语句procedure TMenuItem.Adva ...

  5. 解决body设置height:100%无效问题

    1. 解决html设置height:100%无效问题 通常我们需要让自己的网页内容能够更好的适配各种屏幕大小,会采用height:100%,但是我们发现问题出来了,height:100%无效,其实解决 ...

  6. 元素设置disabled属性后便无法向后台传值

    元素设置disabled属性后便无法向后台传值

  7. 给标签设置disabled属性后提交不了数据

    项目中遇到给select标签添加disabled属性然后提交表单的时候不能提交该表单的数据到后台, readonly属性对提交数据没有限制,但是readonly属性对radio.select.chec ...

  8. MVC dropdownlist 后端设置select属性后前端依然不能默认选中的解决方法

    -----------------------------------来自网上的解决方法--------------------------------------------- ASP.Net MV ...

  9. bootstrap-table设置height后表头与内容无法对齐的问题

    bootstrap-table项目官网:https://github.com/wenzhixin/bootstrap-table bootstrap-table各版本下载:https://github ...

随机推荐

  1. 洛谷 - P4567 - 文本编辑器 - 无旋Treap

    https://www.luogu.org/problem/P4567 事实证明无旋Treap是不是不可能会比Splay快? #include<bits/stdc++.h> using n ...

  2. 问题 M: 最亲密的x个人

    问题 M: 最亲密的x个人 时间限制: 1 Sec  内存限制: 128 MB提交: 412  解决: 38[提交] [状态] [命题人:jsu_admin] 题目描述 有一天,地球受到了降维打击,从 ...

  3. c# ASP.NET MVC easyui-filebox 图片上传和显示

    原文:https://www.cnblogs.com/huatao/p/4727398.html https://www.cnblogs.com/weiweithe/p/4363458.html 表单 ...

  4. win32 socket 编程(六)——UDP

    基于 UDP 无连接的 socket 编程 一.服务器端操作流程 1.1加载套接字库(WSAStartup) 1.2 创建套接字  (socket) 1.3将创建的套接字绑定到一个本地地址和端口上   ...

  5. webpack之给目录起别名

    1. 配置文件目录: build>webpack.base.config.js: resolve: { alias: { '@': resolve('src'), //照猫画虎 'styles' ...

  6. linux查看 inotify 提供的工具

    [root@rsync-client-inotify ~]# ll /usr/local/bin/inotify* -rwxr-xr-x. 1 root root 38582 Jun 3 22:23 ...

  7. alert(1) to win 5

    function escape(s) { var text = s.replace(/</g, '<').replace(/"/g, '"'); // URLs tex ...

  8. BZOJ 1911 特别行动队 (斜率优化)

    $ BZOJ~1911~*~ $ 特别行动队: (斜率优化) $ solution: $ 感觉这道题目还是比较常规的,首先我们很容易想到DP,因为题目里面说了选出的人都是连续的,这意味着我们可以从前往 ...

  9. 21.Nodejs基础知识(下)——2019年12月16日

    2019年10月04日16:56:23 7. 模块 7.1 暴露一个类,字段 var bar = require("./bar.js"); var msg = "你好&q ...

  10. python开发之virtualenv与virtualenvwrapper

    在使用 Python 开发的过程中,工程一多,难免会碰到不同的工程依赖不同版本的库的问题: 亦或者是在开发过程中不想让物理环境里充斥各种各样的库,引发未来的依赖灾难. 此时,我们需要对于不同的工程使用 ...