HTML - DIVs se Sobreponen

 
Vista:
sin imagen de perfil

DIVs se Sobreponen

Publicado por Kevin (1 intervención) el 17/12/2013 16:08:03
Estimados, tengo una pagina en HTML, y necesito 4 div, el problema es que se Sobreponen cuando achico la ventana, con la ventana maximizada no hay ningún problema. Me gustaría que cuando se achique la ventana se ordenaran los div uno sobre otro.

aquí esta el código:
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
<body>
<div style="position: relative; height:150px">
<p align=right><img src="http://busvanchile.cl/img/Traslado%20de%20Personal%20TIPO%202.png" width="300" height="150" align="left" />Traslado de Personal</p>
<p align=right>asdasdasdasdasdasdasssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</p>
<p align=right>asssdasdasdasdasdasdasdasdsadsadsadsadsadsaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
<p align=right>asddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</p>
</div>
<hr>
<div style="position: relative; height:150px; margin:60px 0px">
<p><img src="http://busvanchile.cl/img/Giras%20de%20Estudio%20TIPO%202.png" width="300" height="150" align="right" />Giras de Estudio</p>
<p>asdasdasdasdasdasdasssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</p>
<p>asssdasdasdasdasdasdasdasdsadsadsadsadsadsaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
<p>asddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</p>
</div>
<hr>
<div style="position: relative; margin:60px 0px">
<p align=right ><img src="http://busvanchile.cl/img/Viajes%20dentro%20de%20Chile%20TIPO%202.png" width="300" height="150" align="left" />Viajes dentro de Chile</p>
<p align=right>asdasdasdasdasdasdasssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</p>
<p align=right>asssdasdasdasdasdasdasdasdsadsadsadsadsadsaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
<p align=right>asddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</p>
</div>
<hr>
<div style="position: relative; margin:60px 0px">
<p><img src="http://busvanchile.cl/img/Viajes%20Especiales%20TIPO%202.png" width="300" height="150" align="right" />Viajes Especiales</p>
<p>asdasdasdasdasdasdasssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</p>
<p>asssdasdasdasdasdasdasdasdsadsadsadsadsadsaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
<p>asddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</p>
</div>
</body>


Tampoco quiero usar una plantilla CSS, por eso uso el Style en cada etiqueta....


Espero me puedan ayudar, Saludos!
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve
Val: 1.144
Oro
Ha mantenido su posición en HTML (en relación al último mes)
Gráfica de HTML

DIVs se Sobreponen

Publicado por xve (1543 intervenciones) el 17/12/2013 20:11:07
Hola Kevin, para ello, tienes que utilizar tantos por cientos, ya que sino, aparecera la barra verticial, aunque tambien tienes imagenes... algo así:

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
<div style="position: relative; height:25%">
    <p align=right><img src="http://busvanchile.cl/img/Traslado%20de%20Personal%20TIPO%202.png" width="50%" height="25%" align="left" />Traslado de Personal</p>
    <p align=right>asdasdasdasdasdasdasssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</p>
    <p align=right>asssdasdasdasdasdasdasdasdsadsadsadsadsadsaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
    <p align=right>asddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</p>
</div>
<hr>
<div style="position: relative; height:25%; margin:60px 0px">
    <p><img src="http://busvanchile.cl/img/Giras%20de%20Estudio%20TIPO%202.png" width="50%" height="25%" align="right" />Giras de Estudio</p>
    <p>asdasdasdasdasdasdasssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</p>
    <p>asssdasdasdasdasdasdasdasdsadsadsadsadsadsaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
    <p>asddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</p>
</div>
<hr>
<div style="position: relative; margin:60px 0px">
    <p align=right ><img src="http://busvanchile.cl/img/Viajes%20dentro%20de%20Chile%20TIPO%202.png" width="50%" height="25%" align="left" />Viajes dentro de Chile</p>
    <p align=right>asdasdasdasdasdasdasssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</p>
    <p align=right>asssdasdasdasdasdasdasdasdsadsadsadsadsadsaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
    <p align=right>asddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</p>
</div>
<hr>
<div style="position: relative; margin:60px 0px">
    <p><img src="http://busvanchile.cl/img/Viajes%20Especiales%20TIPO%202.png" width="50%" height="25%" align="right" />Viajes Especiales</p>
    <p>asdasdasdasdasdasdasssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss</p>
    <p>asssdasdasdasdasdasdasdasdsadsadsadsadsadsaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
    <p>asddddddddddddddddddddddddddddddddddddddddddddddddddddddddddddd</p>
</div>

Coméntanos si te sirve, ok?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar