Soporte » Diseño – Temas y plantillas » Se me desestructura mi sucesión de secciones

  • Resuelto alesina

    (@alesina)


    Hola a todos! Soy nueva en esto del diseño web y tengo un problema que no he podido arreglar.
    Escribiendo yo misma el código HTML y CSS, busco estructurar una página de la siguiente manera:

    Son varias secciones; alineadas una hacia la izquierda, otra hacia la derecha y así sucesivamente.

    En algún momento lo logré, pero mientras trataba de editar los textos algo pasó y varias secciones perdieron el ancho y quedaron así: https://goo.gl/NCRET5

    Aquí está mi código HTML: https://pastebin.com/MYmmxz9T
    Y el CSS: https://pastebin.com/Na21XMp2

    Por más que busco no pillo el error. A veces logro ordenar todo en su lugar otra vez, pero intento editar detalles y se desordena de nuevo. Agradeceré cualquier ayuda.

    • Este debate fue modificado hace 5 años, 10 meses por alesina.
    • Este debate fue modificado hace 5 años, 10 meses por alesina.

    La página con la que necesito ayuda: [accede para ver el enlace]

Viendo 7 respuestas - de la 1 a la 7 (de un total de 7)
  • Moderador almendron

    (@almendron)

    Prueba a usar «float=left» para la imagen y quita lo del salto de línea (br)

    Y después de cada sección pones:

    <div class="clear"></div>

    y luego en la hoja de estilos añades

    .clear {
    	margin-bottom:1em;
    	clear:both;
    }

    Quítale la clase flex-cont a los círculos. Cambia esto:
    <div class="shape-circle left flex-cont">
    a esto
    <div class="shape-circle left">

    Y limpia los floats de las secciones. Tendrás que meterles alguna clase para que no afecte al resto del sitio:

    section {
        clear: both;
        padding-top: 30px;
    }

    https://imgur.com/a/LFkmFdv

    @almendron se me ha adelantado mientras escribía la respuesta, las dos opciones deberían funcionar

    Iniciador del debate alesina

    (@alesina)

    Se ordenó! Qué alegría! Muchas gracias, Nilo y Almendron!
    Sólo me queda mejorar el detalle de centrar verticalmente los textos de cada imagen para que queden como a la mitad del círculo. No sé si me explico. ¿Algún modo de hacerlo que sea más elegante que rellenar con <br>?

    @alesina yo probaría a dar una altura fija a la sección. Y despues vertical aling:center

    Corrijo: vertical-aling: middle

    Iniciador del debate alesina

    (@alesina)

    @mikel1998 Intenté lo que dices, pero no me funcionó. Gracias de todas formas!

Viendo 7 respuestas - de la 1 a la 7 (de un total de 7)
  • El debate ‘Se me desestructura mi sucesión de secciones’ está cerrado a nuevas respuestas.