[Sugerencia] lo que hicimos - otra manera | HTML5 y CSS3 parte 2: Posicionamiento, listas y navegación | Alura Latam

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./css/style.css">
    <title>Productos</title>
</head>
<body>
   <main>

         <header class="row_items">
             <h1>
                <img src="./img/logo.png" alt="logo">
             </h1>
             <nav>
                <a href="index.html">Home</a> 
                <a href="productos.html">Productos</a>
                <a href="contactos.html">Contacto</a>
             </nav>
         </header>

    </main>
</body>
</html>

*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;

}


main{
    display: flex;
    flex-flow: column nowrap; 
    width: 100%;
}

.row_items{
    display: flex;
    flex-flow: row nowrap;

}

header{
    justify-content: space-around;
    padding: 10px 0;
    background-color:  #f0f3f4;
}

header nav{
    margin-top: 8%;
}
header nav a {
    text-transform: uppercase;
    text-decoration: none;
    margin-right: 15px;
    color: #000;
    font-weight: bold;
}