La imagen se me baja cuando el text crece.
Publicado por Daniel (3 intervenciones) el 04/08/2017 11:51:55
Hola estoy haciendo un árbol genealógico, cuando el texto crece me baja la imagen os mando un ejemplo del fallo con los códigos.
Muchas gracias a todos por la ayuda.
HTML
CSS
Muchas gracias a todos por la ayuda.
HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<div class="tree-nodo">
<div class="tree-bisabuelos">
<div class="imagen-perro">
<img src="dog.jpg" />
</div>
<div class="dog-text">
<p>Perro Consultado Nº 1, AAA, BBB, CCCC,s asa dad asdas dasd asdas datos del Abuelo. </p>
</div>
</div>
<div class="tree-bisabuelos">
<div class="imagen-perro">
<img src="dog.jpg" />
</div>
<div class="dog-text">
<p>Perro Consultado Nº 1, datos del Abuelo. </p>
</div>
</div>
....
</div> <!--bisabuelos-->
</div>
CSS
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
39
40
41
42
43
44
45
46
.family-tree {
width: 1024px;
display: block;
margin: 20px auto;
}
.family-tree .tree-nodo {
float: left;
width: 22%;
height: 700px;
position: relative;
border: solid 1px;
}
.tree-bisabuelos .imagen-perro {
display: inline-block;
position: relative;
padding: 2px, 2px;
}
.tree-bisabuelos .imagen-perro img {
display: inline-block;
margin: 10px 5px;
width: 45px;
border-radius: 10%;
background-color: white;
}
.family-tree .tree-bisabuelos {
width: 90%;
height: 80px;
display: block;
position:relative;
margin: 5px 0;
background-color:beige;
}
.family-tree .tree-nodo .tree-bisabuelos .dog-text{
display: inline-block;
line-height: normal;
padding: 5px 5px;
width: 70%;
/*position: absolute;*/
}
Valora esta pregunta
0