如何将两个左右对齐文本的底部与父容器的底部对齐？

想象一下，你有这样的：如何将两个左右对齐文本的底部与父容器的底部对齐？

<div class="parent_with_height200px"> 
    <div class="left">This is the left floated text, size 12px</div> 
    <div class="right">This is the right floated text, size 40px</div> 
</div>

我怎样才能让在具有基线父DIV的相互对齐底部的两个文本“立”？

完全可以更改css/html，这是我想要的结果。

来源

2011-04-12 tobefound

您可以使用定位（'底部：0'），但是这取决于你的布局。 – feeela 2011-04-12 14:53:32

对不起，需要使用流布局。 – tobefound 2011-04-13 06:00:17

由于feeela说，使用位置是你将如何完成这一点。

.parent_with_height200px { 
    height: 200px; 
    position: relative; 
    background-color: #DDDDDD; 
    } 

.left { 
    width: 50%; 
    position: absolute; 
    bottom: 0px; 
    left: 0px; 
    background-color: #999999; 
    } 

.right { 
    width: 50%; 
    position: absolute; 
    bottom: 0px; 
    right: 0px; 
    background: #444444; 
    }

在这里看到的输出：Example

来源

2011-04-12 14:58:16

嗯，它很接近，如果真正的流动布局不能实现，我可以用像素定位。我试图玩竖直对齐，但无济于事。你的解决方案也没有对齐字体的基线，它将文本容器的底部对齐，这是不一样的。看到这里：http://jsfiddle.net/GxYx8/13 – tobefound 2011-04-13 06:12:48

如果我理解你正确的，这应该是你在找什么：[http://jsfiddle.net/GxYx8/23/](http： jsfiddle.net/GxYx8/23/） – 2011-04-13 17:42:25

这是你在找什么？

.left { 
    float:left; 
    width:50%; 
} 
.right { 
    float:left; 
    width:50%; 
}

来源

2011-04-12 14:55:45 Sam

你如何解决这个问题将对齐父容器底部的两个浮点数的内容？ – tobefound 2011-04-13 06:05:43

如何将两个左右对齐文本的底部与父容器的底部对齐？

回答

相关问题