Como alinear los elementos por css para principiantes

Me hacen tanto esta consulta! Siempre se arma lio centrando elementos, sea vertical u horizontalmente. No me llama la atención ya que hay que conocer bien la estructura del sitio y son muchas las maneras de lograrlo, cuestion de gustos y el entorno de trabajo.

Hay que tener en cuenta el display, float, y también top, right, bottom, left. Se me marean.

Los elementos (div, p, span) tienen por defecto distintos display. Por ejemplo los div vienen como block, y ocupan todo el espacio de la pantalla posible, haciendo que los elementos contiguos pasen a otra línea. Los span vienen inline por defecto, y se ordenan al contrario que los block, ocupan el espacio del contenido sin hacer saltar de línea a los contiguos. Por último les cuento que está también el inline-block, se comporta como block con la diferencia que respeta lo que se determine de padding y margin.

Ahora, modificando por css el display cambiamos el comportamiento de los elementos y aquí entran las variables de cómo centrar. Hay tantas maneras de hacerlo que antes de revisar el código lxs mando al siguiente link XD

http://howtocenterincss.com/

Hace una serie de preguntas y devuelve un código prolijo.

Fíjense que se está implementando el display FLEX, toda otra historia, ya que el html no venía pensado para ordenar elementos de manera vertical.

Yo, le veo futuro al flex XD

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *