css-grid 相关问题

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

CSS网格最小轨道大小通过查看内容

我有一些最小尺寸为 200px 的 html 元素。 我想创建一个包含这些元素的网格,每行最多有 5 个元素。 如果该行没有足够的空间容纳 5 个,我想要...

回答 1 投票 0

如何将网格渲染为表格

我需要将网格渲染为表格格式,例如我有两行,后面跟着这个CSS: 步骤1: .grid-container { 显示:网格; 网格模板列:自动; 背景-

回答 1 投票 0

防止内容扩展网格项目

TL;DR:是否有类似 table-layout:fixed for CSS grid 的东西? 我尝试创建一个年视图日历,其中包含月份的大 4x3 网格,以及用于日期的嵌套 7x6 网格。 日历...

回答 4 投票 0

网格布局垂直溢出

所以我尝试为所有屏幕尺寸创建响应式网格布局。当屏幕尺寸减小时,网格中的内容会垂直溢出。就好像柱子的高度我...

回答 1 投票 0

使用网格使项目拉伸以填充行中的空间

我想要一个网格 .wrapper div,其中有 3 个 .card div,利用子网格,每个 .card div 中有 2 个部分。由于子网格,这些部分应该对齐,这就是为什么我...

回答 1 投票 0

为什么我不能将按钮置于媒体查询中

所以我在网格中制作了两个按钮,为了使它们彼此靠近,我对按钮使用 justify-self: start 和 justify-self: end 。一切都很好,直到我做了一个媒体问题...

回答 1 投票 0

如何在不换行元素的情况下连续显示 x 项、y 项、z 项?

我想做一些类似于 justify-content:space-around 或 justify-content:space- Between 的事情,但使用: x 个项目并排在左侧, y 个项目并排在中间, z 物品侧面...

回答 5 投票 0

如何使不完整的 CSS 网格行将其项目向右对齐?

我有一个非常简单的按钮网格,就像电话拨号盘一样。最后一行没有足够的项目来填充它,我希望该行的项目向右排列,以便间隙位于 l...

回答 1 投票 0

CSS 媒体查询不覆盖主 CSS

我有一个网格容器,具有 1fr 1fr 1fr 列布局,现在我想为较小的设备(小于 493px)使用不同的布局。因此,我为此进行了媒体查询。但对于某些...

回答 1 投票 0

具有自定义布局的可滚动网格

我需要构建一个带有网格的布局,应该类似于下图: 到目前为止我所做的是: .horizontal-scroll-container { 宽度:100%; 溢出-x:滚动; } 。网格 { 迪...

回答 1 投票 0

CSS 网格布局中每列之间的边框

我正在尝试在 CSS 网格布局中的每列之间添加边框。但是,在我的包装器 div 内,我所拥有的 div 不包含相同的内容,因此当我尝试设置 border-top 时...

回答 2 投票 0

如何在 CSS 网格布局中指定行高?

我有一个 CSS 网格布局,我想让一些(中间 3 行)拉伸到最大尺寸。我可能正在寻找类似于 flex-grow: 1 对 Flexbox 的作用的属性,但我不能...

回答 4 投票 0

尝试为网站创建 HTML CSS 网格

我正在为一家律师事务所构建一个网站,我正在尝试实现如下图所示的 CSS 网格。 我在每个网格中添加图标和填充时也遇到问题要处理。 .grid-column {

回答 1 投票 0

网格优先级:顺序与网格列/网格行

问题 如果存在冲突,网格列和网格行是否始终优先于网格中的顺序? 文档 放置速记 网格项放置算法 显示顺序:顺序

回答 1 投票 0

CSS 子网格在元素之间添加了不均匀的空间

我正在使用子网格来创建间距均匀的卡片。由于某种原因,卡片在元素之间添加了大量空间,并且 FF 和 Chrome 中的空间不同。以下是基于本教程的代码。 .w...

回答 1 投票 0

如何在网格CSS中指定最大列数?

我的WordPress页面是这样的:https://wechange.es 在“Accessorios”部分(右侧)中,我不想显示产品“iPhone Reacondicionado”,我该怎么做?这不是一个

回答 1 投票 0

网格中的可折叠行

我正在使用网格布局来显示几行。每行包含 3 列(一个图像、一个标签和一个 svg 图形),我想(基于一些与此处不相关的逻辑)隐藏/取消隐藏整个行。 之后...

回答 1 投票 0

根据第 1 列中的值,在具有 XPATH 的网格中选择第 2 列中的特定值

我正在Python中使用selenium来使用我的组织的特定网站自动跟踪活动的出席情况。与会者列表以网格形式构建,第 1 列包含姓名...

回答 1 投票 0

网格问题:为什么第 2 列中的 <ul> <li> 项显示在彼此的下面?我希望他们彼此相邻。 (产品、关于和关注)

与 CSS 网格相关的问题:我希望 Fotomatic、产品详细信息、关于我们和关注我们显示在同一行中,每个都在自己的列中,但产品详细信息、关于我们和关注我们是

回答 2 投票 0

类似网格的矩阵,兼容 d3.js 和行过渡效果

我有一个多行3列的网格设计。这些行代表类似文件夹结构的东西,即有一个父级和一些子级,他们也可以有一些子级,依此类推。 活动...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.