Merge pull request #12 from tinkersain/tanisha

imgdesc added
tinkersain · Jul 6, 2024 · 61c6082 · 61c6082
2 parents f7f292b + 0f8d1ba
commit 61c6082
Show file tree

Hide file tree

Showing 2 changed files with 116 additions and 0 deletions.
diff --git a/imgdesc.css b/imgdesc.css
@@ -0,0 +1,60 @@
+body {
+  margin: 0;
+  padding: 0;
+}
+
+.navbar {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 10px 20px;
+  background-color: #333;
+  color: white;
+}
+
+.brand-name {
+  font-family: "Kode Mono", monospace;
+  font-optical-sizing: auto;
+  font-weight: 40px;
+  font-style: normal;
+}
+
+.nav-menu {
+  display: flex;
+  gap: 20px;
+}
+
+.nav-menu a {
+  color: white;
+  text-decoration: none;
+}
+
+.content {
+  padding: 20px;
+}
+
+.image-left,
+.image-right {
+  display: flex;
+  align-items: center;
+  margin-bottom: 20px;
+}
+
+.image-left img,
+.image-right img {
+  max-width: 200px;
+  max-height: 200px;
+  background-color: blueviolet;
+}
+
+.image-left .description {
+  flex: 1;
+}
+
+.image-right {
+  flex-direction: row-reverse;
+}
+
+.image-right .description {
+  flex: 1;
+}
diff --git a/imgdesc.html b/imgdesc.html
@@ -0,0 +1,56 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>SPACE</title>
+    <link rel="stylesheet" href="./imgdesc.css" />
+  </head>
+  <body>
+    <div class="navbar">
+      <div class="brand-name">SPACE</div>
+      <div class="nav-menu">
+        <a href="#">Home</a>
+        <a href="#">About</a>
+        <a href="#">Services</a>
+        <a href="#">Contact</a>
+      </div>
+    </div>
+
+    <div class="content">
+      <div class="image-left">
+        <img
+          src="https://apod.nasa.gov/apod/image/1911/Arp273_HubblePohl_960.jpg"
+          alt="Galaxies"
+        />
+        <div class="description">
+          <h2>Galaxies</h2>
+          <p>
+            Galaxies are vast systems of stars, gas, dust, and dark matter,
+            bound together by gravity. There are different types of galaxies,
+            including spiral galaxies, elliptical galaxies, and irregular
+            galaxies. Each type has unique characteristics and structures.
+          </p>
+        </div>
+      </div>
+
+      <div class="image-right">
+        <img
+          src="https://4.bp.blogspot.com/-oqLrgf_q5qM/U68fguDIIUI/AAAAAAAACd4/Dci6GW2E53c/s1600/SOLAR-SYSTEM-scope.jpg"
+          alt="Solar System"
+        />
+        <div class="description">
+          <h2>Solar Systems</h2>
+          <p>
+            A solar system consists of a star and all the objects that are bound
+            to it by gravity, including planets, moons, asteroids, comets, and
+            meteoroids. Our solar system, with the Sun at its center, is just
+            one of many in the universe. There are various types of solar
+            systems, each with different arrangements and characteristics of
+            celestial bodies.
+          </p>
+        </div>
+      </div>
+    </div>
+  </body>
+</html>