css-grid相关内容
MDN align-content, justify-content 和 justify-items 将 baseline 描述为它们的可能值之一.虽然 baseline 在与 align-items 或 align-self 一起使用时有意义，但我不明白它如何与 justify-content、justify-items、justify-self 和 align-content 属性.你有什么建
..
是否可以创建具有 grid-auto-flow:dense 属性的不同大小项目的无序列表?我目前有一个无序的术语列表，从左侧和右侧填充我的页面，任何不适合的术语都会被推送到下一行.然而，这会在页面右侧留下空白，这对于响应式设计来说是不合适的(列表从左侧开始).我查看了 flexbox 的 flex-flow 属性，但我没有找到任何可以模仿 grid-auto-flow:dense 的东西.
..
在这里研究了一些问题，但它们并没有完全解决我正在寻找的问题. 假设我有一个网站并且我想要.在桌面上我想要这个: 这很容易.grid-template-columns: repeat(3, 33%)(基本上) 然而，在移动设备上，我想要这个 我遇到的是在它翻转到单列之前发生的: 我正在尝试 clamp()、minmax() 和各种各样的东西，但没有任何东西能如我所愿.是
..
据我所知，justify-items 和 justify-self CSS 属性用于 CSS 网格布局，在 Flexbox 布局中没有任何影响(不像不同的justify-content 财产).事实上，MDN 在 justify-items 和 justify-self 的文档中都说 在 flexbox 布局中，此属性被忽略 并且在 Flexbox 中的框对齐 页面. 然而，神秘
..
如果您查看下面的示例，我希望标题 (h4.child-title) 在父容器中具有相同的长度. 但我没有成功实现这一目标. 感谢任何帮助. .top-level {显示:弹性；flex-flow:行包装；}.部分 {显示:弹性；flex-flow: 行 nowrap;边框:1px 实心；右边距:12px；边距顶部:12px；}.section-child {显示:弹性；flex-
..
我已经阅读了很多关于 CSS 弹性框和 CSS 网格的教程，但坦率地说，我就是不知道如何做这个简单(?)的事情. 我只想让容器中的元素都和最宽的元素一样宽. 我不希望它们填满容器的整个宽度，只是全部增长到最大宽度.可以用 CSS 来完成吗? 考虑这个 HTML: 普通按钮tiny一个非常、非常
..
我有一个 PHP 脚本，它通过邮件发送以下 HTML :
..
这个链接(https://css-tricks.com/snippets/css/a-guide-to-flexbox/) 表示默认值 justify-content &align-content 是 flex-start 和 stretch 追溯. MDN (https://developer.mozilla.org/en-US/docs/Web/CSS/justify-content &
..
的 MDN 文档justify-items 指出: 在块级布局中，它会在内联轴上对齐包含块内的项目. 现在，我认为此属性仅用于 display:flex 或 display:grid 元素，但规范指出它可以用于所有元素. 所以我想尝试一下它是如何与 display:block 一起工作的，但不幸的是我无法让它以任何方式工作.它什么都不做. 所以我的问题是:有人可以提供一个示
..
我正在尝试创建某种 flex 容器的通用组件.该组件由连续的容器及其子组件组成. 如果一行中有太多的孩子，那些没有足够空间的孩子会去第二行.使用 flexbox 可以轻松实现，但我也希望能够在元素之间设置装订线.并且一行的第一个和最后一个元素不应该分别有左边距和右边距. 我使用负边距技术来做到这一点，但这里的问题是如果容器太大，右边距会引发溢出问题.我可以通过添加 overflow:
..
我有一个弹性盒问题.任何人都可以指出我正确的方向吗?甚至可能是 flex-box 无法解决这种情况，因为它的工作方式. 我想跨 4 列显示内容. 将内容以柱状格式列出，并在空间不足时换行到下一列. display: flex;弹性方向:列；flex-wrap: 包裹;高度:px 应该注意这一点. 但这就是事情变得棘手的地方.如果我不想要一个固定的高度，而是一个根据内容
..
想要:一种仅 CSS 的解决方案，可在每行的基础上启用多个等高网格“部分"，这也是响应式的. 注意:这是这个问题 每个项目只有一个“等高"部分 - 这可以通过 flexbox 实现 下图应该有助于解释要求: “项目网格"应该是响应式的——因为它可以根据视口宽度显示每行不同数量的卡片(桌面版 4 个，移动版 2 个).在给定的行中，等效的“内容"和“功能"部分应该具有相同的高度.
..
基于上一个问题，我'我试图在我的网格布局中添加更大的块.在最后一个问题中，我需要一个跨多行的 div.现在的问题是我需要一个 div 来跨越多行和多列. 如果我有一个五元素行，我如何将更大的元素放在中间?(因为 float 自然而然地把它放在一边). 这是一个示例片段: #wrapper{宽度:516px；}.堵塞{显示:内联块；宽度:90px；高度:50px；边距:5px；背景
..
是否可以定义具有最大列数的网格，但允许元素在屏幕宽度改变时换行到新行上? 我已经实现了允许行换行到新行的类，但没有最大列数. 这是一种方法的CodePen使用弹性盒: CSS: .flex-container {显示:弹性；flex-wrap: 包裹;} 另一种方法是使用网格: .grid {显示:网格；计数器重置:网格项；位置:相对；}.grid--自动适应{网格模板列:
..
我想在 CSS 中实现网格效果，所有元素的宽度都相同，但高度不同.我希望下方的元素始终位于底部元素的 50 像素处，无论接下来是什么. 我尝试过浮动，但那个错误.所以我尝试了 Flex，但它仍然没有达到我想要的效果. .container显示:弹性柔性包装对齐内容 flex-start对齐项目 flex-start 我想要什么: 我有什么: 解决方案 尝试新的 CSS 网格
..
我想创建一个带有响应方块的网格布局. 我觉得我应该能够使用 CSS Grid 布局来做到这一点，但是在将每个正方形的高度设置为等于宽度时遇到了麻烦. 也无法在每个方块之间设置排水沟. 使用 flexbox 会更好吗? 目前我的 HTML 看起来像这样，但会是动态的，所以可能会添加更多的方块.当然，它需要具有响应性，因此最好使用媒体查询将其折叠为一列.
..
Flexbox 用于 1-D，Grid 用于 2-D 但我还没有找到明确的解释为什么 Grid 不能用于 1-D 并取代 Flexbox.我最接近的是 但你也可以争辩说，像这样的纯一维布局更在 Flexbox 中很强大，因为 Flexbox 允许我们移动这些元素更容易(例如，将它们全部移到一侧或另一侧，改变它们的顺序，将它们均匀地隔开等). 我使用 Grid 和 Flexbox 进行基
..
我正在使用 CSS 网格来布局一些这样的项目... #container {显示:网格；网格模板列:16.666% 16.666% 16.666% 16.666% 16.666% 16.666%；}.物品 {背景:青色；白颜色;填充:20px；边距:10px；}
Item
Item
..
这个 codepen 在 Chrome 上创建一个 100*50 像素的红色单元格网格.这是预期的行为. #grid{显示:网格；网格间距:8px；网格模板列:100px 100px；}.细胞{背景颜色:红色；填充底部:50%；}
..
我正在尝试将嵌套的 li (ul li ul li) 放置在创建于最顶层 ul 的 CSS 网格上.还没有爱(它不起作用).也许这是不可能的，或者我遗漏了什么? #orgChart ul.orgChartLevel1 {显示:网格；网格模板列:12px 自动；网格模板行:100 像素自动自动；网格行距:30px；}#orgChart li.orgChartLevel2b {网格列开始:2；网
..
