From 1c0a0968d65589025dfa1a3251e3548850e4fb41 Mon Sep 17 00:00:00 2001 From: 1Ali1077 Date: Sat, 2 Aug 2025 10:07:10 +0300 Subject: [PATCH 1/6] .\01-margin-and-padding-1\style.css --- .../block-and-inline/01-margin-and-padding-1/style.css | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/foundations/block-and-inline/01-margin-and-padding-1/style.css b/foundations/block-and-inline/01-margin-and-padding-1/style.css index f4d0a7084532..865ca9466389 100644 --- a/foundations/block-and-inline/01-margin-and-padding-1/style.css +++ b/foundations/block-and-inline/01-margin-and-padding-1/style.css @@ -7,15 +7,15 @@ body { background: pink; border: 3px solid blue; /* CHANGE ME */ - padding: 0px; - margin: 0px; + padding: 32px; /*right*/ + margin: 12px; /*right*/ } .two { background: lightblue; border: 3px solid purple; /* CHANGE ME */ - margin-bottom: 0px; + margin-bottom: 48px; /*right*/ } .three { @@ -23,6 +23,6 @@ body { border: 3px solid brown; width: 200px; /* CHANGE ME */ - padding: 0px; - margin-left: 0px; + padding: 32px; /*right*/ + margin-left: auto; /*wrong*/ } \ No newline at end of file From 5bdca4bc66a5da7b3c9a69197f47df40d70892dd Mon Sep 17 00:00:00 2001 From: 1Ali1077 Date: Sat, 2 Aug 2025 11:29:58 +0300 Subject: [PATCH 2/6] block-and-inline,2 --- .../02-margin-and-padding-2/index.html | 2 +- .../02-margin-and-padding-2/style.css | 15 +++++++++++++++ 2 files changed, 16 insertions(+), 1 deletion(-) diff --git a/foundations/block-and-inline/02-margin-and-padding-2/index.html b/foundations/block-and-inline/02-margin-and-padding-2/index.html index c3a26c4e2edd..5441895ad110 100644 --- a/foundations/block-and-inline/02-margin-and-padding-2/index.html +++ b/foundations/block-and-inline/02-margin-and-padding-2/index.html @@ -11,7 +11,7 @@

I'm a card

I have content inside me..lorem ipsum blah blah blah. Here's some stuff you need to read.
-
and a
+
and a
diff --git a/foundations/block-and-inline/02-margin-and-padding-2/style.css b/foundations/block-and-inline/02-margin-and-padding-2/style.css index 00d1de59bf90..e7f0e369de5a 100644 --- a/foundations/block-and-inline/02-margin-and-padding-2/style.css +++ b/foundations/block-and-inline/02-margin-and-padding-2/style.css @@ -7,21 +7,36 @@ body { width: 400px; background: #fff; margin: 16px auto; + padding: 8px; /*right*/ + } .title { background: #e3f4ff; + margin-bottom: 8px; /*right*/ + font-size: 16px; /*right*/ + padding: 8px; /*right*/ } .content { background: #e3f4ff; + margin-top: 16px;/ + margin-bottom: 16px; /*wrong*/ + margin-left: 8px;/ + margin-right: 8px;/ } .button-container { background: #e3f4ff; + text-align: center; /*right*/ + padding: 8px; /*right*/ } button { background: white; border: 1px solid #eee; + margin-top: 8px;/ + margin-bottom: 8px; /*half right*/ + margin-left: 24px;/ + margin-right: 24px;/ } \ No newline at end of file From 232e8a741a7531df97dfb9e15e3cace76a78959e Mon Sep 17 00:00:00 2001 From: 1Ali1077 Date: Sat, 2 Aug 2025 12:15:09 +0300 Subject: [PATCH 3/6] solve: fix the style.css bug --- foundations/cascade/01-cascade-fix/style.css | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/foundations/cascade/01-cascade-fix/style.css b/foundations/cascade/01-cascade-fix/style.css index daf07e0e8a47..1522b275d46f 100644 --- a/foundations/cascade/01-cascade-fix/style.css +++ b/foundations/cascade/01-cascade-fix/style.css @@ -1,3 +1,5 @@ +/* All done right */ + body { font-family: Arial, Helvetica, sans-serif; } @@ -8,16 +10,16 @@ body { font-weight: 800; } -.small-para { - font-size: 14px; - font-weight: 800; -} .para { font-size: 22px; } +.small-para { + font-size: 14px; + font-weight: 800; +} -.confirm { +.button.confirm { background: green; color: white; font-weight: bold; @@ -29,7 +31,7 @@ body { font-size: 20px; } -.child { +.text.child { color: rgb(0, 0, 0); font-weight: 800; font-size: 14px; From 58ef4de003b88f6a9aacda537a352da60e7f05bb Mon Sep 17 00:00:00 2001 From: 1Ali1077 Date: Sat, 2 Aug 2025 13:47:45 +0300 Subject: [PATCH 4/6] solve: css 01-flex-center --- foundations/cascade/01-cascade-fix/README.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/foundations/cascade/01-cascade-fix/README.md b/foundations/cascade/01-cascade-fix/README.md index 4de0d215f7c3..61af2f100c00 100644 --- a/foundations/cascade/01-cascade-fix/README.md +++ b/foundations/cascade/01-cascade-fix/README.md @@ -1,3 +1,5 @@ +## All done right + # CSS Methods This next exercise for CSS Foundations is going to give you a closer look at the cascade, in particular specificity and rule order. Both the HTML and CSS files are filled out for you, so instead of adding rules yourself, you will simply be editing what is provided. From 83ce8735f9f5588987627bfd1d3a8cd8d2e28a9f Mon Sep 17 00:00:00 2001 From: 1Ali1077 Date: Sun, 3 Aug 2025 23:45:04 +0300 Subject: [PATCH 5/6] Solved: fix the header --- foundations/flex/01-flex-center/index.html | 2 +- foundations/flex/01-flex-center/style.css | 5 +++++ foundations/flex/02-flex-header/style.css | 14 ++++++++++++++ 3 files changed, 20 insertions(+), 1 deletion(-) diff --git a/foundations/flex/01-flex-center/index.html b/foundations/flex/01-flex-center/index.html index 440bf5c5c320..e7c2a6c6bfec 100644 --- a/foundations/flex/01-flex-center/index.html +++ b/foundations/flex/01-flex-center/index.html @@ -1,6 +1,6 @@ - + diff --git a/foundations/flex/01-flex-center/style.css b/foundations/flex/01-flex-center/style.css index e35feacd28d0..8c0ebb07793f 100644 --- a/foundations/flex/01-flex-center/style.css +++ b/foundations/flex/01-flex-center/style.css @@ -1,8 +1,13 @@ +/*wronge*/ + .container { background: dodgerblue; border: 4px solid midnightblue; width: 400px; height: 300px; + display: flexbox; + align-content: center; + justify-items: center; } .box { diff --git a/foundations/flex/02-flex-header/style.css b/foundations/flex/02-flex-header/style.css index cb598c935480..e4788a949ee2 100644 --- a/foundations/flex/02-flex-header/style.css +++ b/foundations/flex/02-flex-header/style.css @@ -1,6 +1,15 @@ +/* 7/10 */ + +*{ + background-color: bisque; +} + .header { font-family: monospace; background: papayawhip; + display: flex; + align-items: center; + justify-content: space-between; } .logo { @@ -9,11 +18,16 @@ color: tomato; background: white; padding: 4px 32px; + } ul { /* this removes the dots on the list items*/ list-style-type: none; + display: flex; + margin: 0; + padding: 0; + gap: 8px; } a { From de7915bf5911c6cd2e646fc0e92880737ed1a17b Mon Sep 17 00:00:00 2001 From: 1Ali1077 Date: Tue, 5 Aug 2025 21:52:14 +0300 Subject: [PATCH 6/6] Solve: fix the Header align similar to the last exercicse --- foundations/flex/03-flex-header-2/style.css | 9 +++++++++ 1 file changed, 9 insertions(+) diff --git a/foundations/flex/03-flex-header-2/style.css b/foundations/flex/03-flex-header-2/style.css index bf4c8af10d4c..735ad44ae592 100644 --- a/foundations/flex/03-flex-header-2/style.css +++ b/foundations/flex/03-flex-header-2/style.css @@ -12,6 +12,8 @@ body { background: white; border-bottom: 1px solid #ddd; box-shadow: 0 0 8px rgba(0,0,0,.1); + display: flex; + justify-content: space-between; } .profile-image { @@ -20,6 +22,8 @@ body { border-radius: 50%; width: 48px; height: 48px; + margin-right: 10px; + } .logo { @@ -27,6 +31,7 @@ body { font-size: 32px; font-weight: 900; font-style: italic; + margin-left: 10px; } button { @@ -41,8 +46,12 @@ a { /* this removes the line under our links */ text-decoration: none; color: rebeccapurple; + } ul { list-style-type: none; + display: flex; + align-items: end; + justify-content: space-between; }