medkhelifi/oc_web_2_header_link

## oc_web_2_header_link
<!DOCTYPE html>
<html lang="fr">
  <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="./style.css" />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <link
      href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;700&display=swap"
      rel="stylesheet"
    />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css"
      integrity="sha512-SzlrxWUlpfuzQ+pcUCosxcglQRNAq/DZjVsC0lE40xsADsfeQoEypE+enwcOiGjk/bSuGGKHEyjSoQ1zVisanQ=="
      crossorigin="anonymous"
      referrerpolicy="no-referrer"
    />

    <title>Booki</title>
  </head>
  <body>
    <nav>
      <img src="./Images/logo/Booki.png" alt="Logo booki" />

      <div>
        <a href="#heberg">Hébergements</a>
        <a href="#activ">Activités</a>
      </div>
    </nav>
  </body>
</html>

## oc_web_2_header_link_style.css
body{
    margin-top: 0px;
}

/* -----------------------------Navbar----------------------------- */

nav img {
  height: 19px;
  width: 62px;
  margin: 0;
  margin-top: 44px;
  margin-right: 100px;
}

nav {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
}

nav div {
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 100%;
  margin-left: 60%;
}

nav a {
  display: flex;
  justify-content: center;
  width: 100%;
  padding-top: 48px;
  text-decoration: none;
  color: black;
  border-top: #ffffff 2px solid;
  margin: 0;
}

nav a:hover {
  color: #0065fc;
  border-top: #0065fc 2px solid;
}
	<!DOCTYPE html>
	<html lang="fr">
	<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="./style.css" />
	<link rel="preconnect" href="https://fonts.googleapis.com" />
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
	<link rel="preconnect" href="https://fonts.googleapis.com" />
	<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
	<link
	href="https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;700&display=swap"
	rel="stylesheet"
	/>
	<link
	rel="stylesheet"
	href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.3.0/css/all.min.css"
	integrity="sha512-SzlrxWUlpfuzQ+pcUCosxcglQRNAq/DZjVsC0lE40xsADsfeQoEypE+enwcOiGjk/bSuGGKHEyjSoQ1zVisanQ=="
	crossorigin="anonymous"
	referrerpolicy="no-referrer"
	/>

	<title>Booki</title>
	</head>
	<body>
	<nav>
	<img src="./Images/logo/Booki.png" alt="Logo booki" />

	<div>
	<a href="#heberg">Hébergements</a>
	<a href="#activ">Activités</a>
	</div>
	</nav>
	</body>
	</html>
	body{
	margin-top: 0px;
	}

	/* -----------------------------Navbar----------------------------- */

	nav img {
	height: 19px;
	width: 62px;
	margin: 0;
	margin-top: 44px;
	margin-right: 100px;
	}

	nav {
	display: flex;
	flex-direction: row;
	align-items: center;
	width: 100%;
	}

	nav div {
	display: flex;
	flex-direction: row;
	justify-content: center;
	width: 100%;
	margin-left: 60%;
	}

	nav a {
	display: flex;
	justify-content: center;
	width: 100%;
	padding-top: 48px;
	text-decoration: none;
	color: black;
	border-top: #ffffff 2px solid;
	margin: 0;
	}

	nav a:hover {
	color: #0065fc;
	border-top: #0065fc 2px solid;
	}