Question

我想通过底线对齐列表中的文字。我使用vertical-align css选项，但它不起作用。你可以在这里找到代码： http://jsfiddle.net/kL4AX/2/ 提前致谢

Answer 1

您可以使用定位将<h1>元素移动到列表项的底部，例如 jsFiddle example

.navigator ul li {
    display: inline-block;
    width: 100px;
    height: 400px;
    vertical-align: bottom;
    border-style:solid;
    border-width:1px;
    position:relative;
}

.navigator ul li h1 {
    margin:0;
    padding:0;
    position:absolute;
    bottom:0;
}

Answer 2

是的，您可以尝试将H1定位为绝对底部，或者如果您的<li>具有固定高度，则可以使用填充顶部值来确保H1位于底部。< / p>

垂直对齐不会使元素相对于其父元素居中或定位。

vertical-align在列表中不起作用

2 个答案: