个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
25
4
align-self 的文档状态:
The align-self CSS property aligns flex items of the current flex line overriding the align-items value.
然而，这不会发生:
.example {
display: flex;
align-items: center;
border: 1px solid blue;
height: 8ex;
}
.example > div {
border: 1px solid red;
}
#a > div:last-child {
align-self: top;
}
#b > div:last-child {
align-self: center;
}
#c > div:last-child {
align-self: bottom;
}<body>
<div id="a" class="example"><div>1</div><div>2</div></div>
<div id="b" class="example"><div>1</div><div>2</div></div>
<div id="c" class="example"><div>1</div><div>2</div></div>
</body>文档还说:
If any of the item's cross-axis margin is set to auto, then align-self is ignored. The property doesn't apply to block-level boxes, or to table cells.
但是，这些都不起作用:
div 显式添加 margin:0。display:inline 添加到子 div。div 更改为 span。为什么 align-self 不起作用？
最佳答案
top 和 bottom 不是 align-self 的有效值。使用 flex-start 和 flex-end 代替:
.example {
display: flex;
align-items: center;
border: 1px solid blue;
height: 8ex;
}
.example > div {
border: 1px solid red;
}
#a > div:last-child {
align-self: flex-start;
}
#b > div:last-child {
align-self: center;
}
#c > div:last-child {
align-self: flex-end;
}<body>
<div id="a" class="example"><div>1</div><div>2</div></div>
<div id="b" class="example"><div>1</div><div>2</div></div>
<div id="c" class="example"><div>1</div><div>2</div></div>
</body>关于html - Flexbox align-self 被忽略，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/44396753/
25
4
0
我试图找出在表格单元格上放置对齐属性与使用 text-align css 属性之间的区别。下面的代码显示了 IE 与其他浏览器中的不同结果。在 IE 中，对齐最终会对齐每个子子项，因此文本“test”
我正在 summernote HTML 编辑器上做一些 POC，我正在使用自定义工具栏，但我不知道如何添加对齐(左对齐、居中对齐、右对齐)工具栏，所以有人可以帮助我实现这一目标。 还有人可以帮我找到更
以下是从节对齐转换为文件对齐的步骤: 找到数据的 RVA 从 RVA 导出引用的数据所属的部分。这是微不足道的，因为部分不重叠。文件头中提供了各个部分的起始地址。 找出RVA和section的起始地址
align-self 在以下代码中， align-self 与 flex-wrap: nowrap 一起使用。 flex-container { display: flex; flex-wra
这是CSS: .divPhoto { border:1px solid #999; width:140px; height:140px; border-radius:3
我正在为 Windows Phone 8 开发，我已经设计了我的应用程序，我注意到有一个“分配网格”代码，默认情况下可以在新项目中取消注释。 看看下面的文件中的描述: --> 这是取
我们有浏览器前缀或黑客 (for Google and Safari) text-align: -webkit-right; (for Firefox) text-align:
最近我观察到，在 Clang 9.0 上 alignof 和 __alignof 为 unsigned long long 返回不同的值，并且在 https://reviews.llvm.org/D5
我已经一年多没有为 Android 开发了，我对它有点生疏了。我正在尝试设置一个有点简单的 UI:屏幕底部的底部栏和它上面的 fragment (但没有填充整个高度)。像这样: 我认为这会很简单，但经
你好，我正在尝试找到一种使用“讨厌的”align=center 技巧的方法.. 嗯，当我查看一些代码时，我注意到两个非常相似的片段呈现的并不相同。我找不到让他们表现相同的方法。这包括用 div 替换顶
抱歉这个愚蠢的问题。我只想知道我们什么时候讨论内存中的数据应该如何对齐之类的。这个主题是叫“内存对齐”还是“数据对齐”，还是我可以随便叫它什么？ 最佳答案 在编程的上下文中，它被称为 data str
所以我只是想制作一个简单的导航栏，并且我刚开始使用 flexbox。为什么 align-content 在这里不起作用？我可以让 justify-content 工作，但我就是无法垂直对齐。这是代码。
我从这个 SO 开始答案，我试图使用提供的纯 flexbox 答案。 然而，当我尝试这个时，我看到了以下结果。 我不确定为什么 Button 4 在行中出现的位置高于其余元素。 HTML
我已通读 A complete guide to Grid ，但仍然对两组容器属性之间的差异感到困惑，即“justify/align-items”与“justify/align-content”。 我
我有一个simple plunker here. .container { display:flex; flex-flow: row nowrap; justify-content: sp
从 http://code.google.com/p/berkeleyaligner/ 下载主干代码后，我将该项目添加到 Eclipse 上的构建路径中。然后，使用下面的代码，我可以提取从 sourc
这个问题在这里已经有了答案: What's the difference between align-content and align-items? (15 个答案) 关闭 7 年前。 我发现 C
[short text][image1][image2]____________________________________ [this is a reallyyyyyyy............
我有一个很小的菜单列表，当鼠标靠近时它应该会增长。在其原始状态下，菜单是右对齐的，悬停时每第二个元素向右移动并左对齐以为增加的高度腾出空间(参见 JSFiddle )。 ul { font-siz
这个问题在这里已经有了答案: Align child elements of different blocks (3 个答案) 关闭 3 年前。
我是一名优秀的程序员,十分优秀！