Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
1
respuesta

Ajustando los espacios: Proyecto final

@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
*{
    margin: 0;
    padding: 0;
}
body{
    background-color: #003092;
    color: #fff2db;
    height: 100vh;
    box-sizing: border-box;
}
.presentacion{
    display: flex;
    align-items: center;
    margin: 10% 15%; 
    <justify-content: space-between;
}


.texto-destacado{
    color: #22D4FD
}


.presentacion_content_title{
    font-family: "Krona One", sans-serif;
    font-size:36px;
}

.presentacion_content{
    width: 780px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.presentacion_content_texto{
    font-family: "Krona One", sans-serif;
    font-size:24px;
}

.presentacion_enlaces{
    display: flex;
    justify-content: space-between;
}

.presentacion_enlaces_link{
    width: 280px;
    background-color: #22d4fd;
    text-align: center;
    padding: 21.5px ;
    border-radius: 5px;
    font-family: "Montserrat ",sans-serif;
    font-size: 24px;
    font-weight: 600;
    text-decoration: none;
    color: black;
}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Portafolio</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header></header>
    <main class="presentacion">
        <section class="presentacion_content">
            <h1 class="presentacion_content_title">Eleve tu negocio digital a otro nivel <strong class="title_f">con un Front-end de calidad!</strong></h1>
            <p class="presentacion_content_texto"><strong class="texto-destacado">¡Hola! Soy Ana García</strong>, desarrolladora Front-end con especialización en React, HTML y CSS. Ayudo a pequeños negocios y diseñadores a llevar a cabo buenas ideas. ¿Hablamos?</p>
            <div class="presentacion_enlaces">
                <a class="presentacion_enlaces_link" href="https://www.instagram.com/">Instagram</a>
                <a class="presentacion_enlaces_link" href="https://github.com/">GitHub</a>
            </div>
        </section>
        <img src="Imagem.png" alt="Imgagen de Ana Garcia TRabajando">
    </main>
    <footer></footer>
</body>
</html>
1 respuesta

¡Hola Estudiante, espero que estés bien!

Espero que estés bien. He revisado tu código y parece que hay un pequeño error en la declaración de CSS que podría estar causando problemas en el diseño de tu proyecto. En la clase .presentacion, tienes un error de sintaxis en la línea que intenta justificar el contenido. Actualmente tienes:

<justify-content: space-between;

El símbolo < al inicio es innecesario y está causando un error. Deberías corregirlo a:

justify-content: space-between;

Con esta corrección, el contenido de la clase .presentacion debería distribuirse correctamente entre los elementos hijos, lo que probablemente ayudará a ajustar los espacios como deseas.

Espero que esta sugerencia te sea útil y que puedas avanzar con tu proyecto final. ¡Bons estudios!