Bonjour,
j'essaye de faire en sorte que mes DIV bubble se retrouve l'un en dessous des autres en les laissant en bas du DIV Bubbles, je suis pas expert en CSS donc je rame un peu là.

Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
#Content
{
    width: 100%;
    height: 100vh; min-height: 100vh; max-height: 100vh;
}
 
#Wrapper
{
    width: 450px;
    height: 300px;
}
#Avatar
{
    float: left;
    width: 150px;
    min-height: 300px;
    background: url("../images/Avatar.png") left bottom no-repeat;
}
#Bubbles
{
    position: relative;
    float: right;
    width: 300px;
    min-height: 300px;
    background-color: #666666;
}
#Bubbles .bubble
{
    position: absolute;
    bottom: 0px;
    margin: 5px;
    padding: 5px;
    width: 280px;
 
    border-radius: 0.4em;
    background-color: #F2F2F2;
    box-shadow: #cccccc 2px 2px 0px;
}

Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
<div id="Content">
        <div id="Wrapper">
            <div id="Avatar"></div>
            <div id="Bubbles">
                <div class="bubble">Contenu du texte1</div>
                <div class="bubble">Contenu du texte2</div>
            </div>
        </div>
</div>

Malheureusement comme ça tous les DIV bubble se superpose étant donnée qu'ils ont tous le bottom:0;

Comment faire pour que chaque DIV bubble ce retrouve les un en dessous des autres ?