对齐位置绝对元素含量上下只有一个元素

Question

我有里面的文字内容没有任何标签的位置绝对的div元素，像这样：

<div class="element"> 
    This is some content... 
</div> 


.element{ 
    position: absolute; 
    top: 10px; 
    left: 10px; 
    right: 10px; 
    bottom: 10px; 
    overflow: hidden; 
    padding: 10px; 
    color: white; 
} 

我要对准该内容的底部div，但不使用更多的html标签（如this answer on a similiar question），以保持简单。

我怎样才能实现这一点使用CSS只？

Answer 1

可以实现与CSS flexbox这样的：

.element { 
 
    position: absolute; 
 
    top: 10px; 
 
    left: 10px; 
 
    right: 10px; 
 
    bottom: 10px; 
 
    overflow: hidden; 
 
    padding: 10px; 
 
    color: red; 
 
    background: green; 
 
    display: flex; 
 
    align-items: flex-end; 
 
}

<div class="element"> 
 
    This is some content... 
 
</div>