html - 在 CSS 中对齐框中的文本

Question

我想对齐文本

#navigation li a{}

a-element/container/box 不应该离开它的位置。我只想将文本放置在元素/容器/框的左下角（但是它被称为），边缘有一些空间。text-align-assignment 是不够的。还有别的吗？如前所述：a-element/container/box 不应该通过移动 a-box 中的文本来移动。

我无法将另一个盒子放入我的 a-box，因为我使用的导航是

wp_nav_menu

来自wordpress。

Answer 1

试试这个：

更新：使用容器列表项；

#navigation li {
    display: table-cell;
    vertical-align: bottom;
    text-align: left;
    padding: 0; /* if you want no spaces at the edges inside the anchor. */
    /* ... rest of your properties */
}

#navigation li a {
    padding: 0; /* if you want no spaces at the edges inside the list item. */
    /* ... rest of your properties */
}

注意：属性的值，display例如；“表格单元格”，“内联表格”，“表格”，“表格标题”，“表格列”，“表格列组”，“表格行”，“表格行组”， IE7 及更早版本不支持“继承”。IE8 需要一个!DOCTYPE。IE9 支持这些值。

这是关于 jsFiddle 的演示。