当CSS用于列宽时，Vaadin 8网格滚动条的行为不稳定
基础概念
Vaadin 8 是一个用于构建现代 Web 应用程序的 Java 框架。它使用 GWT（Google Web Toolkit）来编译 Java 代码为 JavaScript，从而在浏览器中运行。Vaadin 8 提供了一个强大的网格组件（Grid），用于显示和编辑表格数据。
CSS（Cascading Style Sheets）是一种样式表语言，用于描述 HTML 或 XML（包括 SVG 和 XHTML）文档的外观和格式。
相关优势
- 灵活性：CSS 提供了丰富的样式选项，可以精确控制布局和外观。
- 可维护性：通过外部样式表，可以集中管理样式，便于维护和更新。
- 性能：CSS 可以被浏览器缓存，减少重复加载，提高页面加载速度。
类型
- 内联样式：直接在 HTML 元素中使用
style属性。 - 内部样式表：在 HTML 文档的
<head>部分使用<style>标签。 - 外部样式表：通过
<link>标签引用外部 CSS 文件。
应用场景
CSS 在 Vaadin 8 网格中的应用场景包括：
- 设置列宽
- 设置行高
- 设置单元格样式
- 设置网格整体样式
问题描述
当使用 CSS 设置列宽时，Vaadin 8 网格的滚动条行为可能会变得不稳定。这通常是由于 CSS 样式与网格组件的内部逻辑冲突导致的。
原因
- CSS 样式冲突：可能存在其他 CSS 样式影响了网格的布局和滚动条行为。
- 网格组件内部逻辑：Vaadin 8 网格组件在处理列宽和滚动条时可能存在一些 bug 或未优化的逻辑。
解决方法
- 检查 CSS 样式： 确保没有其他 CSS 样式影响到网格的布局和滚动条行为。可以使用浏览器的开发者工具（如 Chrome 的 DevTools）来检查和调试样式。
- 检查 CSS 样式： 确保没有其他 CSS 样式影响到网格的布局和滚动条行为。可以使用浏览器的开发者工具（如 Chrome 的 DevTools）来检查和调试样式。
- 更新 Vaadin 版本： 如果使用的是较旧的 Vaadin 8 版本，尝试更新到最新版本，可能已经修复了相关问题。
- 自定义滚动条样式： 如果滚动条行为仍然不稳定，可以尝试自定义滚动条样式。
- 自定义滚动条样式： 如果滚动条行为仍然不稳定，可以尝试自定义滚动条样式。
- 使用 JavaScript 调整： 如果 CSS 无法解决问题，可以尝试使用 JavaScript 来调整网格的布局和滚动条行为。
- 使用 JavaScript 调整： 如果 CSS 无法解决问题，可以尝试使用 JavaScript 来调整网格的布局和滚动条行为。
参考链接
通过以上方法，应该能够解决 Vaadin 8 网格在使用 CSS 设置列宽时滚动条行为不稳定的问题。
相关·内容
我在我的Vaadin8应用程序中有一个网格，有时网格的滚动条在不需要的时候出现，或者在不需要的时候消失，甚至会陷入循环。我的网格有五列，我只使用Vaadin 8附带的内置渲染器。我使用CSS将第一列的列宽设置为30%。如果我从主题中删除这一
浏览 33提问于2021-05-11得票数 7
回答已采纳
1回答
我们有一个包含50到66列的Grid。由于某些原因，当我调用grid.setVisible(true)时，它需要一点时间来显示网格和刷新内容。作为比较，我有另一个有23列的Grid，它是即时的，如此之快，我们甚至看不到顶部的蓝线。与33列的Grid相同。所以我的问题是:如何提高grid.setVisible(true)的性能？注意:我知道这完全是在前端(V
浏览 14提问于2021-11-29得票数 0
在用Grid设置了带有setAutoWidth(true)的所有列并执行了grid.recalculateColumnWidths()之后，这将自动调整列的宽度和列的内容，但只适用于网格中可见的行。发生的情况是，在网格中滚动行，我可以发现一些单元格的内容大于第一个可见行上的内容，并且它们不是自动适应的，因此内容被截断(es FOO...)。考虑到我使用的<
浏览 19提问于2022-11-01得票数 0
回答已采纳
我在网格中有14列。
总共需要1600像素的网格，width..it对于浏览器来说太大了，无法显示。我不能自己设置列宽。
浏览 2提问于2015-12-08得票数 0
2回答
我在寻找一种用固定宽度的单元格创建表格的方法。当窗口太窄时，应出现水平滚动条。现在要问的是:在不指定表宽的情况下，是否可以这样做？在现实生活中，表将有动态数量的</em
浏览 5提问于2016-09-07得票数 0
回答已采纳
在Vaadin 8中，排序Grid行就像单击列标题一样简单。这将在升序和降序排序之间切换列，如所述的。这在通过grid.setItems()方法填充网格时起作用。但是，当使用DataProvider作为网格数据源时，单击列标题并不会对行进行排序。
有关于使用的DataProvider描述排序顺序的文档，但在存在多个排序要求时处理排序订单。是否有一
浏览 5提问于2017-09-07得票数 3
回答已采纳
我有一个有很多列的，当列宽的总和大于固定宽度的容器时，它显示如下：而不是有一个水平滚动条，如果网格的宽度太大。我怎样才能得到一个水平滚动条的jQgrid，这样就有一个固定的最大尺寸的网格，如果我添加更多的列，它将只是滚动？
另外，假设这是可能的，
浏览 2提问于2011-02-13得票数 10
回答已采纳
2回答
我使用的是一个叠加在分页工具栏( vaadin-grid - pagination )上的vaadin- grid，我遇到的问题是，在移动设备上，当网格经过视区时，分页并不在视区的底部。 现在，通过Dev Tools检查器，我可以从滚动条中删除一个position: relative属性，这样就可以让事情按照我想要的那样运行。 ? 问题是我无法通过编程来做到这一点……我尝试使用包含以下内容<
浏览 31提问于2021-11-04得票数 1
回答已采纳
2回答
我有Kendo UI网格，它有一个锁定的列，它具有动态宽度和高度。网格的容器正在CSS中调整大小，我使用kendo.resize($("#grid"))来适应网格，一切都很完美。我还有一个在窗口调整大小事件上触发的函数，它正在调整列的宽度。如果可能的话，列应该占据整个网格，而不显示底部滚动条，但是它们也有最小的高度。因此，我计算列</e
浏览 1提问于2015-01-12得票数 4
回答已采纳
，他就可以使用网格的水平滚动条来查看添加的其余列。问题是我显示的列越多，数据网格就会自我调整，导致应用程序的水平滚动条出现，留下两个相邻的水平滚动条，其中一个是数据网格，下面是应用程序的滚动条。这对用户来说既困惑又恼人，现在我不得不使用两个滚动条来查看添加的新列，以及数据<e
浏览 0提问于2009-12-28得票数 3
回答已采纳
3回答
水平展开表
、、、
我想创建一个具有固定大小的列的表(除了第一个扩展以适合最宽单元格的列)。问题是，当水平方向没有足够的空间时，滚动条就不会出现，列就会缩小。此外，我还希望单元格在内容太长时隐藏内容。<td>3</td><tr> <td>
浏览 0提问于2012-02-03得票数 1
什么CSS网格系统做的很快，而我们不能没有他们？这些天来，twitter引导程序在社区中很流行，它基于940 in宽度网格和其他功能，也适用于按钮和jquery插件。我的
浏览 5提问于2012-02-01得票数 2
回答已采纳
2回答
Extjs网格宽度计算错误
、、、、
我正在尝试创建一个没有垂直和水平滚动条的Extjs网格。这意味着网格应该在两个方向扩展到无穷大。<div id="grid-example" class="myDiv"></div><style type="text/css"> overflow:，显示垂直滚动条，正如我所预期的。问题是
这里没有，没有水平
浏览 0提问于2013-08-30得票数 1
回答已采纳
例如，我有一个网格，让用户使用Vaadin 8为某些数据定义颜色，我还想在Vaadin 14 / Flow中提供这一点。在Vaadin 8中，我做到了(对于每种样式/数据类型)： .add(".MyCustomTheme .v-grid-cell." +但是，我似乎不知道如何以编程方式更改cssName的css值。本质上，我如何在Java代码中插
浏览 8提问于2021-08-18得票数 2
回答已采纳
我需要使Vaadin 8网格单元格文本包装。我试着在Vaadin论坛上跟踪这个链接。在我的styles.css文件中，有： word-wrap: break-word;table.setStyleGenerator(style);
tabl
浏览 1提问于2021-10-21得票数 2
回答已采纳
2回答
我有两个并排的网格列。我希望网格是它的容器的宽度。在这个空间内，我希望确保尽可能多地显示每个列的内容。我做了这个演示，网格宽为300 of，这两列是内容可编辑的，因此您可以键入以更改内容长度(因此，min-content和max-content的值也会随着键入而改变)。每列宽150 is。这很好。
当一
浏览 8提问于2021-09-09得票数 1
回答已采纳
如果我通过visual studio设计器减小了gridview的大小，然后重新启动应用程序，那么水平条就不会出现。 用户界面： ? 输出： ? 如何使datagridview行和列换行并自动调整大小，使其在空间中不会卡住？我想让它动态调整行高，并自动显示水平滚动条。
浏览 179提问于2021-08-22得票数 0
我有一个带有许多列的雷达视图(水平滚动条已被激活)。我的网格中有一个CommandColumn &我想将它格式化如下： button.Visibility = ElementVisibility.Hidden; }
浏览 1提问于2019-03-24得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
