From a0473b75aaa41c0bc0b89c211d3add357391cf33 Mon Sep 17 00:00:00 2001
From: Jessica Wilkins <67210629+jdwilkin4@users.noreply.github.com>
Date: Mon, 4 Nov 2024 10:05:41 -0800
Subject: [PATCH] feat(curriculum): adding content for css absolute and review
units review page (#57035)
---
client/i18n/locales/english/intro.json | 3 ++-
.../671a8f8350c20a7439015c98.md | 20 +++++++++++++++++++
2 files changed, 22 insertions(+), 1 deletion(-)
diff --git a/client/i18n/locales/english/intro.json b/client/i18n/locales/english/intro.json
index 3e84dd9cdd3..12ed76c57f5 100644
--- a/client/i18n/locales/english/intro.json
+++ b/client/i18n/locales/english/intro.json
@@ -1950,7 +1950,8 @@
"review-css-relative-and-absolute-units": {
"title": "CSS Relative and Absolute Units Review",
"intro": [
- "Review the CSS Relative and Absolute Units concepts to prepare for the upcoming quiz."
+ "Before you are quizzed on relative and absolute units, you first need to review.",
+ "Open up this page to review concepts like percentages, px, rem, em, and more."
]
},
"quiz-css-relative-and-absolute-units": {
diff --git a/curriculum/challenges/english/25-front-end-development/review-css-relative-and-absolute-units/671a8f8350c20a7439015c98.md b/curriculum/challenges/english/25-front-end-development/review-css-relative-and-absolute-units/671a8f8350c20a7439015c98.md
index 1ef2953299d..37ae02c88a6 100644
--- a/curriculum/challenges/english/25-front-end-development/review-css-relative-and-absolute-units/671a8f8350c20a7439015c98.md
+++ b/curriculum/challenges/english/25-front-end-development/review-css-relative-and-absolute-units/671a8f8350c20a7439015c98.md
@@ -9,7 +9,27 @@ dashedName: review-css-relative-and-absolute-units
Review the concepts below to prepare for the upcoming quiz.
+## Absolute Units
+- **`px` (Pixels)**: This absolute unit is a fixed-size unit of measurement in CSS, providing precise control over dimensions. This means that 1px is always equal to 1/96th of an inch.
+- **`in` (Inch)**: This absolute unit is equal to 96px.
+- **`cm` (Centimeters)**: This absolute unit is equal to 25.2/64 of an inch.
+- **`mm` (Millimeters)**: This absolute unit is equal to 1/10th of a centimeter.
+- **`q` (Quarter-Millimeters)**: This absolute unit is equal to 1/40th of a centimeter.
+- **`pc` (Picas)**: This absolute unit is equal to 1/6th of an inch.
+- **`pt` (Points)**: This absolute unit is equal to 1/72th of an inch.
+
+## Relative Units
+
+- **Percentages**: These relative units allow you to define sizes, dimensions, and other properties as a proportion of their parent element. For example, if you set `width: 50%;` on an element, it will occupy half the width of its parent container.
+- **`em` Unit**: These units are relative to the font size of the element. If you are using `ems` for the `font-size` property, the size of the text will be relative to the font size of the parent element.
+- **`rem` Unit**: These units are relative to the font size of the root element, which is the `html` element.
+- **`vh` Unit**: `vh` stands for `"viewport height"` and `1vh` is equal to 1% of the viewport's height.
+- **`vw` Unit**: `vw` stands for `"viewport width"` and `1vw` is equal to 1% of the viewport's width.
+
+## `calc` Function
+
+- **`calc()` Function**: With the `calc()` function, you can perform calculations directly within your stylesheets to determine property values dynamically. This means that you can create flexible and responsive user interfaces by calculating dimensions based on the viewport size or other elements.
# --assignment--