css-grid 相关问题

CSS Grid Layout是一种允许创建网格的W3C技术。它不需要使用浮动，表格，绝对定位甚至flexbox（另一种CSS3技术）来构建各种网格，从简单到复杂。一般情况下，请勿将此标记用于CSS网格系统。

我正在CodePen中创建一个基本的Web布局，以便更好地理解网格区域如何与CSS Grid模块一起工作。事实证明，使用。当应用于......时，符号实际上并不“隐藏”这些项目

css html5 css-grid

回答 2 投票 0

我有一个经典的布局：#divleft {float：left; } #sidebar {float：right; } @media screen and（max-width：900px）{＃divleft，＃sidebar {float：none; } divleft和侧边栏是......

css css-grid

回答 1 投票 0

可以像在Flexbox中一样在CSS Grid中使用自动边距吗？

据我所知，任何flexbox都可以做，css-grid也应该能够做到（通常更加冗长）。然而，我无法弄清楚如何用一个项目来模仿一个Flexbox，推动其他项目......

html css css3 flexbox css-grid

回答 3 投票 4

CSS Grid中的行应该占用剩余空间[重复]

我有一个非常简单的CSS网格，只有两行：一个标题和一个div。我希望第二行占用所有剩余的视口高度。这是一个repro：html，body {margin：0;填充：0; } * {...

css css-grid

回答 2 投票 4

css网格中的列顶部偏移量

我的css代码需要一些帮助。我正在使用css网格。我有2列。如何为右列添加顶部偏移量？这是我想得到的结果：.parent {background-color：#ddd; ...

css css3 css-grid

回答 1 投票 3

讨论：如果必须编写回退，为什么要使用新的CSS功能？ [关闭]

我与使用CSS Grid的CTO进行了对话，而我最常听到的问题是“为什么要使用网格，如果我们不得不编写flexbox回退，那么在旧浏览器中是不支持的？ ...

html css flexbox css-grid fallback

回答 1 投票 -4

在CSS网格模板区域项目中移动孙子元素

我正在尝试学习CSS网格模板区域。但是我的代码不像预期的区域模板那样工作：“标题标题”“both-a both-b”“left-a right-a”“left-b right-b”所有左侧项目......

html css html5 css3 css-grid

回答 1 投票 0

在CSS Grid Row中扩展卡片

我正在开发一个响应式CSS网格，其中包含1到4列，具体取决于视口大小和任意行数。每个网格框（材质样式卡）的内容都会单击以展开更多数据。 ...

css-grid

回答 1 投票 0

是否可以创建跨越CSS网格中所有行的垂直文本？

想要为网格创建一个节标题（而不是通过将它放在节上方来占据垂直空间），如下所示：当然，第一列跨越带有网格行的行很容易：...

css css3 css-grid

回答 1 投票 7

如何让物品伸展以填充宽度？

.container {display：grid; grid-template-columns：repeat（auto-fill，100px）;网格间隙：3px;边框：1px纯绿色; } .item {border：1px solid red;身高：50px; }

css css3 grid-layout css-grid

回答 1 投票 7

css显示网格和IE11

我意识到我的网格与IE11无法正常工作。如何让网格列启动和网格列结束与IE11一起工作？ https://codepen.io/matoeil/pen/OzNmXW>

css css3 internet-explorer internet-explorer-11 css-grid

回答 1 投票 1

CSS Grid自动添加一个:: before元素

我是CSS的新手，并尝试简单的网格布局。这就是我所拥有的。 CSS .layoutGrid {display：grid;网格间隙：10px; grid-auto-rows：minMax（100px，auto）; } .articleCard ...

html css reactjs css-grid

回答 2 投票 0

使用CSS网格创建表

我正在尝试使用CSS网格创建一个表，基于内容使用相等的列。我想避免使用 . This is a follow-up to this question: Auto-adjusting columns with CSS grid ...

html css css3 css-grid

回答 2 投票 3

如何制作一个CSS网格样式来反转不那么混乱的列

我一直在玩CSS Grid并制作了一个将图像放在文本旁边并反转列中的列顺序下面。当我想要缩小屏幕时...

html css media-queries css-grid

回答 2 投票 0

仅在Mac上的Chrome键入时输入字段变小（可能是CSS-Grid问题）

我创建了一个网站，当我开始输入任何内容时，我输入的字段变得非常小。但此行为仅出现在Mac上的Chrome上（当前版本63）。 Safari上的同一个网站......

html css google-chrome css-grid html-input

回答 1 投票 0

如何使用网格布局居中？

创建（最终）三层树视图结构sports> teams> players progress：https：//jsfiddle.net/zigzag/kusuz233/1/ body {margin：10px; } .firstLevel {display：grid; ...

html css css3 centering css-grid

回答 1 投票 1

为什么网格项目堆放在角落？

我创建了一个网格。但是，出于某种原因，所有网格项目都堆叠在右下角，没有任何高度或宽度，而不是假设网格区域属性的值...

html css html5 css3 css-grid

回答 1 投票 0

动态布局具有不同的高度，但在一个模式中

我不确定这是否可行，但我正在尝试创建一个这样的布局：元素是 's with text inside, coming from a PHP foreach loop. While being pulled from the database, ...

php css flexbox grid css-grid

回答 2 投票 0

两列布局，无需JavaScript即可重新排序项目

有没有办法获得2列布局，使用媒体查询转换为1列布局？ 2列布局的条件：项目应该在...内的列项目中一个接一个地流动

css css3 flexbox media-queries css-grid

回答 2 投票 2

我使用网格做错了什么

我正在尝试使用网格，并在它的右侧制作一个大盒子和两个不同的但是它们都是乱糟糟的，因为我检查它甚至没有显示我的目标模式。什么可能......

html css css-grid

回答 1 投票 0

css-grid 相关问题

最新问题