显示滚动条后,table 表头与内容不对齐,JS脚本控制

/*设置高度、滚动条*/
//其他DIV 高度
var tbheight =
document.getElementById("div_top").scrollHeight +
document.getElementById("div_tools_bar").scrollHeight+document.getElementById("div_tools_bar2").scrollHeight+document.getElementById("tbtop").scrollHeight;

//滚动条DIV高度-其他DIV 高度,超出显示滚动条
var divtb =
document.documentElement.clientHeight - tbheight - 30;

//不对齐解决办法,屏幕减去滚动条宽度
var winwidth = document.documentElement.clientWidth -
16;

var tbheight2 = "height:"+String(divtb) + "px;overflow:
auto; overflow-x:hidden; ";
var tbwidth2 =
"width:"+String(winwidth) + "px;";

//滚动条DIV

$("#divtblist").attr("style",tbheight2);
//表头tb

$("#tbtop").attr("style",tbwidth2);

$(".GridBar").attr("style",tbwidth2);

时间: 2024-10-10 16:56:08

显示滚动条后,table 表头与内容不对齐,JS脚本控制的相关文章

elementui中table组件表头和内容不对齐的问题

表头与内容没对齐 在样式里加入 .el-table th.gutter{ display: table-cell!important; } 终于舒服了 原文地址:https://www.cnblogs.com/reround/p/11981909.html

前端固定table表头方法之css和js结合实现

由于我的页面比较复杂就不贴完整代码了,这里就讲大概思路 先设置css /** 隐藏滚动条 */ ::-webkit-scrollbar { width: 8px; background-color: transparent; } table tbody { display: block; width: calc(100% + 8px); /*这里的8px是滚动条的宽度*/ /*height: 600px;*/ height: auto; overflow-y: scroll; -webkit-o

div超出内容后自动显示滚动条

只需要用到css的一个overflow:auto的属性就可以实现这效果了.下面我们看看代码和实现的效果 HTML代码如下: <textarea name="" id="message" cols="30" rows="10" placeholder="" maxlength="2000" style="overflow: auto;" class="&

关于JLable列表的自动滚动条的显示:当JLable列表的内容超出JPanel面板所规定的高度时,自动显示滚动条的方法

关于JLable列表的自动滚动条的显示:当JLable列表的内容超出JPanel面板所规定的高度时,自动显示滚动条的方法: 通过下面的方式把JLable表的宽度和高度锁死,不能根据列表内容的增加而自动出现滚动条: JPanel tablePanel = new JPanel(); JScrollPane jScrollPane1 = new JScrollPane(); JTable teacherTable = new JTable(); //表 teacherTable.setMaximum

限制div高度当内容多了溢出时显示滚动条

1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type"content="text/html; charset=utf-8" /> 5 <title>限制div高度,内容多了显示滚动条</title> 6 <style type="text/css"> 7 div{ border-r

bootstrap-table 使用遇到的问题总结:1.右上角button样式自定义;2.右上角引用图标自定义;3.表头/表格内容显示不对齐;4.自定义设置表头及表格边框样式

问题一:右上角button样式自定义 方法: //修改bootstrap-table右上角按钮样式 $(".table-box .columns-right button").removeClass("btn-secondary").css({"backgroundColor": "#fafafa","border": "1px solid #c2c2c2","color&qu

Table显示滚动条

项目中需要在js文件中动态的往table里面添加数据,当数据的量到一定的程度的时候,就希望能够出现滚动条,现记录如下: Html文件:<div style="width:468px;height:260px;overflow:scroll;background:#9D9D9D;"> <table id="detail" style="width:450px;background:#9D9D9D;border-collapse:separa

关于DEDECMS自定义模型当中添加自定义字段后在后台添加内容后不显示解决方案

用DEDECMS的时间也不长,最近在做一个站时,就遇到了这个问题(自定义字段在后台不显示内容)中添加自定义字段后在后台编辑打开后发现我之前添加的内容不显示,如果是只是看看不单击确定的话,那么在前台数据的调用就是正常的,但是再次回到后台发现,那个几个字段就是不显示,没办法,在网上查了一下,还是没有找到问题的原因,算了于是自己看了一下他的附加表当中是不是有什么问题,打开后发现了,原来是在数据库里面字段的名是大写(PS:我在添加自定义字段是喜欢首字母大写)应该不会是这个问题吧!于是我把他们改成了小写字

当Table中td内容为空时,显示边框的办法

原文:当Table中td内容为空时,显示边框的办法 1111111111111 目录 定义和用法 实例 浏览器支持 可能的值 定义和用法 说明 实例 浏览器支持 可能的值 相关页面 1. 在 table的css里面加: border-collapse:collapse; 在 td 的css里面加:      empty-cells:show; 2 .最简单的就是 在TD里写个  说明: border-collapse设置或检索表格的行和单元格的边是合并在一起还是按照标准的HTML样式分开. 定义