edit style

Author: Dipa-Sarker

Wireframe/index.html

@@ -33,8 +33,7 @@ <h3>Summary</h3>
         </p>
         <a href="https://en.wikipedia.org/wiki/README">Read more</a>
       </article>
-      <section class="row">
-       <article>
+      <article>
         <img src="https://cdn.sanity.io/images/599r6htc/regionalized/4c8605ad998d69b03a6eefb850cce5e23a0a96dc-2880x1440.png?w=2880&h=1440&q=75&fit=max&auto=format" alt="Wireframe" />
         <h2>What is the purpose of a wireframe?</h2>
         <h3>Summary</h3>
@@ -54,8 +53,8 @@ <h3>Summary</h3>
           and labels instead of polished visuals.
         </p>
         <a href="https://en.wikipedia.org/wiki/Website_wireframe">Read more</a>
-       </article>
-       <article>
+      </article>
+      <article>
         <img src="https://media2.dev.to/dynamic/image/width=1000,height=420,fit=cover,gravity=auto,format=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F2aridnng7k6bly55lic9.jpeg" alt="Git Branch" />
         <h2>What is a branch in Git?</h2>
         <h3>Summary</h3>  
@@ -70,8 +69,7 @@ <h3>Summary</h3>
            </ul>
         </p>
         <a href="https://www.w3schools.com/GIT/git_branch.asp?remote=github">Read more</a>
-       </article>
-      </section>
+      </article>
     </main>
     <footer>
       <p>

Wireframe/style.css

@@ -25,18 +25,6 @@ svg {
   width: 100%;
   object-fit: cover;
 }
-.row {
-  display: flex;
-  gap: 10px;
-}
-
-.row img {
-  flex: 1;
-  width: 50%;
-  height: 200px;
-  object-fit: cover;
-}
-
 main {
   max-width: var(--container);
   margin: 0 auto calc(var(--space) * 4) auto;
@@ -69,19 +57,9 @@ article {
   }
 }
 .container {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  gap: 20px;
-}
-.row {
   display: flex;
-  gap: 10px;
+  gap: 20px;
+  align-items: flex-end;
 }
 
-.row img {
-  flex: 1;
-  width: 50%;
-  height: 200px;
-  object-fit: cover;
-}