css-grid

    1热度

    1回答

    我想显示无数的div。 我希望每个div都在新行中。 比如现在在包装我设置: wrap { display: grid; grid-template-rows: repeat(4, [row] 25px); } 和每个格我设置: div1 { grid-row: "row" }, div2 { grid-row: "row 2"} ....等等 我怎么能在CSS中处

    3热度

    1回答

    有没有替代这个,或者我应该恢复浮动并等到支持到达? .grid_root { display: grid; grid-column-gap: 1px; grid-auto-flow: column; grid-auto-columns: min-content; } 样品(在手机上使用全屏幕预览): https://plnkr.co/edit/c6Zn

    0热度

    1回答

    * { margin: 0; padding: 0; } .container { height: 100%; width: 100%; display: grid; grid-template-columns: 1fr 2fr; grid-template } h

    0热度

    1回答

    我即将实现与CSS网格模板 在这里看到:https://www.w3.org/TR/css-grid-1/ 或这个漂亮的文章:https://css-tricks.com/snippets/css/complete-guide-grid/ 但我必须定义在网格的行和列CSS,所以我想知道这个布局如何与动态内容,例如无限滚动。 或修改元素数量的ajax请求。 如果我不得不加载新行有没有办法只使用CSS

    0热度

    1回答

    我有一个CSS网格布局,我希望为每个偶数列添加一个页边距。 :nth-column伪类将很好,但不会很快得到支持。 是否有任何polyfills我可以使用或我必须写我自己?

    0热度

    2回答

    我需要两张图片在CSS网格布局中重叠而不会发生作弊,并且必须使用CSS网格完成。意味着它应该留在布局单元格中。以下是我工作: “中间”应在画面的中心,并在页面上两个中心,分别是“旗帜”胰岛β细胞 下面的CSS布局应保持不变期望: .container { display: grid; grid-template-columns: 15% 70% 15%; grid-t

    4热度

    3回答

    如何向上移动“内容”和“右”区块?问题是我不能使用子嵌套网格。我不需要黑客:无边距,因为标题可以是不同的高度。没有JavaScript。只有纯CSS。如果可能的话。 现在我的标记看起来像这样: .wrapper { border: 1px solid red; display: grid; grid-template-columns: 1fr 2fr 1f

    2热度

    1回答

    我是新的网格布局,我正在尝试使用它的自动包装设计。 我的代码如下: #grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); grid-template-rows: 200px 200px 200px 200px; grid-gap

    8热度

    1回答

    我正在创建一个填充了<div>元素的页面。包含这个div的容器有display: flex;。所以这些项目自动换行为几行。现在我想点击一个项目,以便打开另一个<div>,其中包含关于所选项目的信息。但是这个信息div应该在包含所选div的行的下面,并且包含容器的全部宽度。 我不知道如何使这项工作。 我做了一个简单的JsFiddle开始:https://jsfiddle.net/44j4jnq4/3

    1热度

    1回答

    我正在修补CSS网格,并想知道在调整屏幕大小时是否可能使嵌套网格移出其父网格。 我试过改变grid-template-areas以包含“subcontent”,但这似乎是错误的并且扰乱了网格。 作为一个例子,我设置了以下模板,并希望在触发媒体断点时用“subcontent”div(粉红色)替换“配置文件”区域。 有没有什么办法可以在纯CSS的网格中做到这一点,而无需在JS中进行绑定? .wrapp