我一直在努力进行垂直对齐,这是一个看似简单的过程,在不同的语言和元素类型中有很多特性。我已经通过stackexchange做了很多阅读,似乎无法找到一个共同的理解线程。
以下是我能够收集的规则:
1)垂直对齐在<\div>
中不起作用,您必须设置div {display: table-cell; vertical-align: middle}
这似乎是一个很大的麻烦,特别是因为表格单元格覆盖高度限制,即使溢出设置为隐藏并扩展以适应内容,这意味着垂直“中心”是可变的。
我刚从Pinterest中读到了button {vertical-align: middle}
的一些源代码,但其他vertical-align
命令似乎没有用。看起来好像按钮默认在中间对齐。
有人可以为vertical-align
属性提供明确的解释吗?
vertical-align
?
vertical-align
属性?
vertical-align
属性?
关于理解特质的任何线索也会有所帮助!
提前致谢!
答案 0 :(得分:1)
对于vertical-align是两个选项
一个在元素上。
垂直对齐适用于inline
元素而非块元素。然后,您可以直接在元素中设置proeperty以与其他内联元素对齐。
两个在容器上
您可以像table-cell
一样在容器上设置属性。您可以对td
上的元素进行垂直对齐,也可以使用divs
和display:table
对display:table-cell
div进行垂直对齐,将其内容垂直对齐。
答案 1 :(得分:0)
http://css-tricks.com/centering-in-the-unknown/
只需浏览一下它会对你有所帮助,但只是一个粗略的想法:)