important change for article 2 have same height as article 3

Author: Jacknguyen4438

Wireframe/index.html

@@ -36,21 +36,27 @@ <h2>READ ME.md file and what is purpose.</h2>
     <!--The second Item-->
     <div id="row-side">
       <div class="content-size">
-        <article class="article-border">
-          <img
-            src="https://images.prismic.io/prismic-main/Zoa6gh5LeNNTwzHJ_web_design_wireframe.jpeg?auto=format,compress"
-            alt="Is an example of how to design web layout" class="image-size-2" />
-          <h2>What is a wireframe and the purpose of it used</h2>
-          <p id="paragraph-3">
-            What is wireframe, wireframe
-            is a way to design a website service at the structural level.
-            A wireframe is commonly used to layout content and functionality on a page which takes into account user
-            needs and user journeys.
-            wireframes are used early in the development process to establish the basic structure of a page before
-            visual design and content is added.
-          </p>
-          <a href="https://www.figma.com/resource-library/what-is-wireframing/" target="_blank"
-            class="Link-box-border">Read more</a>
+        <article class="article-border" id="article-2">
+          <div>
+            <img
+              src="https://images.prismic.io/prismic-main/Zoa6gh5LeNNTwzHJ_web_design_wireframe.jpeg?auto=format,compress"
+              alt="Is an example of how to design web layout" class="image-size-2" />
+
+            <h2>What is a wireframe and the purpose of it used</h2>
+            <p>
+              What is wireframe, wireframe
+              is a way to design a website service at the structural level.
+              A wireframe is commonly used to layout content and functionality on a page which takes into account
+              user
+              needs and user journeys.
+              wireframes are used early in the development process to establish the basic structure of a page before
+              visual design and content is added.
+            </p>
+          </div>
+          <div>
+            <a href="https://www.figma.com/resource-library/what-is-wireframing/" target="_blank"
+              class="Link-box-border">Read more</a>
+          </div>
         </article>
       </div>
 
@@ -62,11 +68,13 @@ <h2>What is a wireframe and the purpose of it used</h2>
             alt="a detail map on what is git and branch" class="image-size-2" />
           <h2>Git, repo and branch</h2>
           <p>
-            Git, repo and branch are some basic knowledge that you should learn when you start programming. They can be
+            Git, repo and branch are some basic knowledge that you should learn when you start programming. They can
+            be
             a powerful tool
             that will help you on your journey, especially later on when you do a group project or your own personal
             project.
-            Git is a free and open source distributed version control system designed to handle everything from small to
+            Git is a free and open source distributed version control system designed to handle everything from small
+            to
             very large projects with speed and efficiency,
             how ever they also allow you save, control and redo your project file version. Repository is when you work
             on a group project

Wireframe/style.css

@@ -86,17 +86,23 @@ article {
 
 .content-size {
     width: 30%;
-
+    display:flex;
 }
 
 .image-size-2 {
     width: 100%;
     height: 300px;
 }
 
-#paragraph-3{
-    margin-bottom: 132px;
+#article-2{
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    justify-content: space-between;
 }
+
+
+
 /*This for the read more button do not deleted*/
 .Link-box-border {
     border: 2px solid black;