Bonjour, je suis débutant.
Je n'arrive pas à trouver comment il faut faire pour donner des couleur toute au long de NAV. J'ai cherché pendant une heure et je n'y arrive pas à trouver de solution. Aider moi s'il vous plait.
Voici mon code et ce que je veux faire

nav
{
	position: fixed;
	display: flex;
	flex-direction: row;
	align-items: baseline;
	width: 60px;
	height: 60px;
	top: 7px;
	margin-left: 10px;
	background-color: rgb(175,166,153);
}

nav img
{
	width: 60px;
	height: 60px;
	position: relative;
	top: 7px;
	margin-left: 10px;
}

nav h1, a
{
	color: white;
	margin-left: 5px;
}

nav ul
{
	list-style-type: none;
	display: flex;
	margin-left: 420px;
}

nav li
{
	margin-right: 20px;
}

nav a
{
	font-size: 1.2em;
	color: white;
	padding: 0.1px;
	text-decoration: none;
}

nav a:hover
{
	color: rgb(82,47,28);
	border-bottom: 6px solid rgb(186,133,81);
}

Le couleur s’arrête juste là

Bonjour,

Je vois déjà un problème ici :

nav
{
    position: fixed;
    display: flex;
    flex-direction: row;
    align-items: baseline;
    width: 60px;
    height: 60px;
    top: 7px;
    margin-left: 10px;
    background-color: rgb(175,166,153);
}

Tu limites ta nav à une largeur ainsi qu'à une hauteur de 60px.

Ta nav est donc un carré de 60px de côté et la couleur ne s'applique qu'à ce minuscule carré.

Bonjour,

comme le dit Mewen_bzh, le problème est là. La solution la plus propre n'est cependant pas width: 100%, mais plutôt left: 0; right: 0; : ainsi tu accroches ton élément des deux côtés.

Autre point : le margin-left: 420px marche chez toi, sur ton écran, mais pas autre part. Pour repousser complètement l'élément, préfère margin-left: auto;.