From 181e12967ae3f2051934ec5123026d69a6d62fe4 Mon Sep 17 00:00:00 2001 From: Shahriar Date: Tue, 19 May 2026 10:18:10 +0100 Subject: [PATCH 01/17] Changed first article positioning to center, centered title and text below --- Wireframe/style.css | 12 +++++++++--- 1 file changed, 9 insertions(+), 3 deletions(-) diff --git a/Wireframe/style.css b/Wireframe/style.css index be835b6c7..f44f515ff 100644 --- a/Wireframe/style.css +++ b/Wireframe/style.css @@ -45,10 +45,17 @@ svg { Setting the overall rules for page regions https://www.w3.org/WAI/tutorials/page-structure/regions/ */ + +header { + text-align: center; +} + main { max-width: var(--container); margin: 0 auto calc(var(--space) * 4) auto; + justify-content: center; } + footer { position: fixed; bottom: 0; @@ -63,10 +70,9 @@ https://gridbyexample.com/learn/ */ main { display: grid; - grid-template-columns: 1fr 1fr; gap: var(--space); > *:first-child { - grid-column: span 2; + grid-column: span 1; } } /* ====== Article Layout ====== @@ -86,4 +92,4 @@ article { > img { grid-column: span 3; } -} +} \ No newline at end of file From cfc6da157e3d1e6524b2c221bf65642029ff30f1 Mon Sep 17 00:00:00 2001 From: Shahriar Date: Tue, 19 May 2026 10:38:27 +0100 Subject: [PATCH 02/17] Created bottom section with two parts side by side with placeholder content --- Wireframe/index.html | 18 ++++++++++++++++++ Wireframe/style.css | 7 +++++++ 2 files changed, 25 insertions(+) diff --git a/Wireframe/index.html b/Wireframe/index.html index 0e014e535..067b3c028 100644 --- a/Wireframe/index.html +++ b/Wireframe/index.html @@ -24,6 +24,24 @@

Title

Read more +
+
+ +

Placeholder

+

+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Molestias rerum hic corporis modi dolor dolore optio quaerat recusandae ipsa. Alias distinctio nulla ex non ea architecto quidem tempore rerum. Sed aut optio explicabo in vel iste deleniti repudiandae nulla illum. +

+ Read more +
+
+ +

Placeholder

+

+ Lorem ipsum dolor sit, amet consectetur adipisicing elit. Inventore, quibusdam exercitationem? Eligendi, veniam id eius fuga amet earum delectus hic, dolore ipsa, aut illum quas tenetur magni velit repellat odit! +

+ Read more +
+