flex

tartempion-sdr · Dec 5, 2024 · b773c11 · b773c11
1 parent 5fd6bac
commit b773c11
Show file tree

Hide file tree

Showing 2 changed files with 49 additions and 23 deletions.
diff --git a/index.css b/index.css
@@ -1,10 +1,16 @@
 body {
     background-color: beige;
 }
+
+
 header {
+    display: flex;
     background: linear-gradient(to right, orange, rgb(242, 185, 79) );
     height: 80px; 
 }
+header .container {
+    margin-left: auto;
+}
 h1, h2 {
     text-align: center;
 }
@@ -22,5 +28,6 @@ button {
 button a {
     color: white;
     text-decoration: none;
-    font-size: 20px;
-}
+    font-size: 17px;
+}
+
diff --git a/index.html b/index.html
@@ -1,27 +1,46 @@
 <!DOCTYPE html>
 <html lang="fr">
-    <head>
-        <meta charset="UTF-8">
-        <meta name="viewport" content="width=device-width, initial-scale=1.0">
-        <link rel="shortcut icon" type="image/x-icon" href="pieuvre.ico">
-        <link rel="stylesheet" href="index.css">
-        <title>-Mon Site-</title>
-    </head>
-    <body>
-        <header> 
-            <button><a href="https://tartempion-sdr.github.io/html_css/index.html">❝⛄❞MON SITE</a></button>
-            <button><a href="https://tartempion-sdr.github.io/html_css/annonces.html">Annonces</a></button>
-            <button><a href="https://tartempion-sdr.github.io/html_css/profils.html">Profils</a></button>
-            <button><a href="https://tartempion-sdr.github.io/html_css/actualitées.html">Actualitées</a></button>
-            <button><a href="https://tartempion-sdr.github.io/html_css/aides.html">Aides</a></button>
-        </header>
 
-        <h1>Proposez & trouvez<br><spam id="p1">les services</spam> et <spame id="p1">les emplois</spame> près de chez vous</h1>
-        <h2><spam id="p1">Création site internet en France : Annonces et offres d'emploi</spam> -</h2>
-        <footer>
-            m'envoyer <a href="mailto:[email protected]">un mail</a>
-        </footer>
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="shortcut icon" type="image/x-icon" href="pieuvre.ico">
+    <link rel="stylesheet" href="index.css">
+    <title>-Mon Site-</title>
+</head>
 
-    </body>
+<body>
+    <header>
+        <button><a href="https://tartempion-sdr.github.io/html_css/index.html">❝⛄❞MON SITE</a></button>
+        <button><a href="https://tartempion-sdr.github.io/html_css/annonces.html">Annonces</a></button>
+        <button><a href="https://tartempion-sdr.github.io/html_css/profils.html">Profils</a></button>
+        <button><a href="https://tartempion-sdr.github.io/html_css/actualitées.html">Actualitées</a></button>
+        <button><a href="https://tartempion-sdr.github.io/html_css/aides.html">Aides</a></button>
+        <div class="container"></div>
+        <button>
+            <a href="https://tartempion-sdr.github.io/html_css/connection.html">Connection</a>
+        </button>
+        <button>
+            <a href="https://tartempion-sdr.github.io/html_css/inscription.html">Inscription</a>
+        </button>
+
+        <button>
+            <a href="https://tartempion-sdr.github.io/html_css/deposezuneannonce.html">DEPOSEZ UNE ANNONCE</a>
+        </button>
+        </div>
+
+    </header>
+
+    <h1>Proposez & trouvez<br>
+        <spam id="p1">les services</spam> et <spame id="p1">les emplois</spame> près de chez vous
+    </h1>
+    <h2>
+        <spam id="p1">Création site internet en France : Annonces et offres d'emploi</spam> -
+    </h2>
+    <footer>
+        m'envoyer <a href="mailto:[email protected]">un mail</a>
+    </footer>
+
+</body>
 
 </html>