创建动态高度语音泡使用CSS

我需要得到一个讲话泡沫是通过CSS看起来是这样的：创建动态高度语音泡使用CSS

我并不需要设置默认高度的盒子。它必须具有动态高度。如果高度增加，左边的箭头必须位于中心。

我看了一些例子，但我不知道如何改变高度！下面是我的代码有：

<style> 
    .bubble 
    { 
    position: relative; 
    width: 250px; 
    height: 120px; 
    padding: 0px; 
    background: gray; 
    margin-left:50px; 
    } 

    .bubble:after 
    { 
    content: ""; 
    position: absolute; 
    top: 45px; 
    left: -15px; 
    border-style: solid; 
    border-width: 15px 15px 15px 0; 
    border-color: transparent gray; 
    display: block; 
    width: 0; 
    z-index: 1; 
    } 
</style> 
<div class="bubble"></div>

来源

2013-08-02 user2632980

这里是JSBin

让

top: 40%; 
bottom: 50%;

在 .bubble

：在CSS脚本后

你必须检查它改变。气泡高度

来源

2013-08-02 07:30:23

创建动态高度语音泡使用CSS

回答

相关问题