在我的 Polymer 2.0 元素中，我使用了 vaadin-grid#3.0.2。有一个包含大量数据的网格 - 20 多列，因此在 div 中有一个 overflow-y 滚动。由于数量较多，网格内的列宽会减小。父 div 有一个 display: flex属性，以便自动生成列的宽度。 我们可以用 CSS 设置列的最小宽度吗？或者我可以用 CSS 控制它吗？
无法在此处重现问题代码，因为数据来自外部服务器 (Oracle VM VirtualBox)。
这是在 HTML 中使用的代码:
<vaadin-grid class="projectworksheet" name="worksheet" items="[[projectData]]" page-size="10"></vaadin-grid>
这里是渲染网格的截图，vaadin-grid自动生成<vaadin-grid-table id="scroller">在 #shadow-root 下我想，这就是我无法控制列的原因 min-width使用 CSS。
最佳答案
单独使用 CSS，您不能跨越 shadow dom 边界，这意味着您将无法从 vaadin-grid 组件外部设置宽度，除非它们提供了 mixin 或 css 变量。
但是您可以使用 javascript 访问 shadowDom 中的元素并设置它们的 css 属性。例如:document.querySelector('vaadin-grid.projectworksheet').shadowRoot.querySelector('vaadin-grid div.col').style.width = '100px'
关于html - vaadin 网格表格列宽控制与 css，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51720286/