css-grid

2热度

2回答

我有一个包含16个网格项目的网格。我想要第一行取4格子项，第二行3，第三行2和第四行7.我希望它们中的每一个均匀间隔，以便它们占据所有可用空间。我可以在某种程度上通过指定grid-template-columns中的数字（即12）和在网格项上使用grid-column-end: span-*来实现此目的。然而，这对于我希望7个项目均匀分布的行是不够的。对电网项目使用grid-column-e

1热度

1回答

为什么我的HTML结构不能使用CSS网格布局？

我想了解HTML结构如何影响CSS Grid Layout Module规范。我正在使用启用了实验性功能的Chrome Canary。附加的代码按预期工作，但将nav和search仅放置在标记标记中用于语义抛出CSS网格放置。我错过了什么能够使用CSS网格模块，并仍然保持我的语义标题包含导航，品牌和搜索包裹在我的标题标记？ html { box-sizing: border-bo

1热度

1回答

CSS网格自动（休息）大小不适用于我

我正在调查CSS网格，我遇到了一些奇怪的事情。我想要3列：1和3是150px宽，其余2。这应该是可能的，我想，但没有奏效： grid-template-columns: 150px auto 150px; 所以我想这一点，并没有工作，但傻： grid-template-columns: 150px calc(100% - 300px) 150px; 然后我碰到这个例子来：http://gr

1热度

2回答

CSS网格 - 输入不尊重填充

我发现当使用CSS Grid Layoutinputs不尊重其包含元素的右侧填充。具体来说，grid-template-colums css属性似乎是罪魁祸首。我发现这个问题，CSS Grid Layout放在一边，通过应用box-sizing: border-box解决。虽然即使应用了这个和CSS重置，我似乎仍然无法解决这个问题。这里是我的作出反应的应用程序的行为的缩写代码片段： http:

4热度

2回答

使用CSS flexbox或网格布局的响应式图片库

我正在使用Image-Gallery-Widget，用户可以在其中设置缩略图宽度，缩略图高度和边距（缩略图之间），并且该小组件将呈现所有图像缩略图一个很好的网格，每个图像具有相同的宽度和高度。我想知道css-flexbox或css-grid是否可以在不需要在代码中定义行和列而不需要断点/媒体查询的情况下实现这一点。缩略图图像被包裹在一个锚，所以画廊的项目（或并网项目）将是这个样子： <a hr

9热度

1回答

vs CSS Grid和CSS模块的代码和智能感知

我正在使用VS代码实现使用CSS Grid和CSS模块的项目。然而，当我尝试这样的事情 .loginRegisterDiv { composes: loginDiv; margin: 0px; width: 100%; } 我得到一个错误说，撰写“未知财产”的撰写。另外我正在使用CSS网格，并且在VS代码中似乎没有任何智能感知。我需要安装扩展吗？我正在使用ra

3热度

1回答

显示：网格 - 百分比与分数

我想了解如何使用display: grid。这是我的例子： https://jsfiddle.net/Lycuuu95/ <style> body { padding: 2em; } .wrapper { display: grid; grid-template-columns: 30% 70%; grid-gap: 10px; } .sid