Buenos días! Bienvenido a mi blog personal. Por favor siéntete cómodo de estar aquí, gracias.

PONER 2 ELEMENTOS EN UNA MISMA LINEA

Deja de flotar! Pàsate a “display:inline-block”!

Posicionamiento tradicional de cajas

Normalmente cuando queremos alinear varios bloques en la misma linea empleamos la propiedad CSS “float”, por ejemplo si queremos posicionar 2 columnas de texto adyacentes, tradicionalmente empleariamos float y left:

1
2
3
4
5
<div>
    <div style="float:left;width: 30%;outline: green solid thin">Box1</div>
    <div style="float:left;width: 30%;outline: red solid thin">Box2</div>   
</div>
<div style="clear:both"></div>

Las cajas creadas tendrían este aspecto:

float_box

Normalmente debemos añadir el siguiente código para que los elementos que siguen no se monten en la misma linea:

1
<div style="clear:both"></div>

Leave a Reply

Be the First to Comment!

avatar
  Subscribe  
Notify of