como puedo alinear una imagen en el centro y un nav al final en un header con flexbox ![]( lo intente hacer con el siguiente codigo pero ...

carlos edgardo trillos baron

Pregunta

student•

como puedo alinear una imagen en el centro y un nav al final en un header con flexbox

![](

lo intente hacer con el siguiente codigo pero al reducir la pantalla se sobre pone.

![](

<body>
    <header>
        <figure class="img_Header">
            <img src="./img/header.png" alt="">
        </figure>
        <nav class="nav">
            <ul>
                <li><a href="">Home</a></li>
                <li><a href="">Libros</a></li>
                <li><a href="">Juegos</a></li>
                <li><a href="">GamePlay</a></li>
            </ul>
        </nav>

    </header>
    <main class="main">
        <aside>

        </aside>
        <section class="section">
            Lorem ipsum dolor sit amet, consectetur adipisicing elit. Odio, vitae iste dicta maxime consectetur libero labore excepturi debitis sapiente facilis in autem hic, molestiae quisquam. Ipsam labore iste consequatur iure.

        </section>
    </main>
    <footer>

    </footer>
</body>```

*{
box-sizing: border-box;
margin:0;
padding: 0;
}
header{
background-color: yellow;
height: 150px;
display:flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
.img_Header img{
width:200px;
}
.nav{
position: absolute;
text-decoration: none;
right:0;

margin-top: 50px;
margin-right: 10px;

}
.nav li{
display:inline-block
}
main{
height: 400px;
display:flex;
}
aside{
width: 500px;
height: 400px;
background-color: brown;
}
section{
height: 400px;
background-color: cornflowerblue;
}
footer{
height: 150px;
background-color: cyan;
}```

Audiel Martinez

student•

hola Carlostrillosbaron Te dejo mi código creo que eso es lo que buscas

resultado

código CSS

como puedo alinear una imagen en el centro y un nav al final en un header con flexbox ![]( lo intente hacer con el siguiente codigo pero ...

Curso de HTML y CSS [Empieza Gratis]

Curso de HTML y CSS [Empieza Gratis]