chore(curriculum): rm vids from what is css lectures (#61577)

2026-05-28 18:26:54 +00:00 · 2025-07-29 13:31:25 -04:00
parent 49d30f54b5
commit d32f06dd1f
10 changed files with 12 additions and 82 deletions
@@ -1,19 +1,12 @@
 ---
 id: 672aa5e1f8b935577acfb2b9
 title: What Is CSS, and What Is Its Role on the Web?
-challengeType: 11
-videoId: yqcOCDoE29w
+challengeType: 19
 dashedName: what-is-css
 ---

 # --description--

-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What is CSS, and what is its role on the web?
-
 CSS, which stands for Cascading Style Sheets, is a crucial component of modern web development. It's a markup language used to apply styles for HTML.

 In simpler terms, if HTML is the structure of a web page, CSS is what makes it look good.
@@ -1,19 +1,12 @@
 ---
 id: 672acbbe2891564c4e316164
 title: What Is the Basic Anatomy of a CSS Rule?
-challengeType: 11
-videoId: s4rjwX3zWCs
+challengeType: 19
 dashedName: what-is-the-basic-anatomy-of-a-css-rule
 ---

 # --description--

-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What is the basic anatomy of a CSS rule?
-
 CSS is responsible for the styles of a web page. All of these styles are made up of various CSS rules.

 A CSS rule is made up of two main parts: a **selector** and a **declaration** block.
@@ -1,19 +1,12 @@
 ---
 id: 672acbce8163374c903253c9
 title: What Is the Meta Viewport Element Used For?
-challengeType: 11
-videoId: 8X647U15ZFo
+challengeType: 19
 dashedName: what-is-the-meta-viewport-element-used-for
 ---

 # --description--

-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What is the meta viewport element used for?
-
 The meta viewport element is a crucial component in responsive web design.

 It's a special HTML meta element that gives the browser instructions on how to control the page's dimensions and scaling on different devices, particularly on mobile phones and tablets.
@@ -1,19 +1,12 @@
 ---
 id: 672acbdd06b44c4cd3bf8713
 title: What Are Some Default Browser Styles Applied to HTML?
-challengeType: 11
-videoId: LWUeF0B-1g4
+challengeType: 19
 dashedName: what-are-some-default-browser-styles-applied-to-html
 ---

 # --description--

-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What are some default browser styles applied to HTML?
-
 When you start working with HTML and CSS, you'll notice that some styles are applied to your web pages even before you write any CSS. These styles are called "default browser styles" or "user-agent styles".

 These default browser styles provide basic formatting to ensure that HTML elements are displayed in a readable way across all browsers.
@@ -110,7 +103,7 @@ In the above code example, we are using an unordered list and an ordered list. B

 For all of these examples, you saw how the browser applied default spacing, varying font sizes, and weights to these HTML elements.

-In later lecture videos, you will learn how to reset some of these default styles using a CSS reset.
+In later lectures, you will learn how to reset some of these default styles using a CSS reset.

 # --questions--

@@ -1,19 +1,12 @@
 ---
 id: 672acbf7490c054d213a8c1f
 title: What Are Inline, Internal, and External CSS, and When Should You Use Each One?
-challengeType: 11
-videoId: BmzjTr_bnSs
+challengeType: 19
 dashedName: what-are-inline-internal-and-external-css
 ---

 # --description--

-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What are inline, internal, and external CSS, and when should you use each one?
-
 CSS can be applied to a webpage in three main ways: inline, internal, or external.

 Each method has its own use case, advantages, and limitations, and knowing when to use each one is essential for writing clean, efficient, and maintainable code.
@@ -74,7 +67,7 @@ Here's the HTML part of our code example:
 </body>
 ```

-In an earlier lecture video, you learned that the `link` element has a `rel` attribute that specifies the relationship between the current document and the linked resource, such as linking to a stylesheet or an external resource.
+In an earlier lecture, you learned that the `link` element has a `rel` attribute that specifies the relationship between the current document and the linked resource, such as linking to a stylesheet or an external resource.

 On the other hand, the `href` attribute specifies the URL of the linked resource, indicating where the resource should be retrieved from.

@@ -1,19 +1,12 @@
 ---
 id: 672acc03c257524d6a5151e8
 title: How Do Width and Height Work?
-challengeType: 11
-videoId: IFVdOw40EK0
+challengeType: 19
 dashedName: how-do-width-and-height-work
 ---

 # --description--

-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-How do width and height work?
-
 In CSS, the `width` and `height` properties are used to control the dimensions of elements on a webpage.

 These properties can be defined in different units such as pixels (`px`), percentages (`%`), viewport units (`vw`, `vh`), and more.
@@ -1,19 +1,12 @@
 ---
 id: 672acc100d59d24da7b4e09c
 title: What Are the Different Types of CSS Combinators?
-challengeType: 11
-videoId: fk16FfT6jpU
+challengeType: 19
 dashedName: what-are-the-different-types-of-css-combinators
 ---

 # --description--

-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What are the different types of CSS combinators?
-
 CSS combinators are used to define the relationship between selectors in CSS. They help in selecting elements based on their relationship to other elements, which allows for more precise and efficient styling.

 We will discuss some primary CSS combinators and their use cases, starting with the descendant combinator.
@@ -1,19 +1,12 @@
 ---
 id: 672acc1e24c1e54df5ad89bd
 title: What Is the Difference Between Inline and Block-Level Elements in CSS?
-challengeType: 11
-videoId: u4OnJrEwfY0
+challengeType: 19
 dashedName: what-is-the-difference-between-inline-and-block-level-elements-in-css
 ---

 # --description--

-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What is the difference between inline and block-level elements?
-
 In HTML and CSS, elements are classified as either **inline elements** or **block-level elements**, and this classification dictates how they behave in the document layout.

 Understanding this difference is crucial for controlling how your content is displayed on a webpage.
@@ -1,19 +1,12 @@
 ---
 id: 672acc3f6f3e3c4e31ec3e12
 title: How Does Inline-Block Work, and How Does It Differ from Inline and Block Elements?
-challengeType: 11
-videoId: PFQnVbZvZJY
+challengeType: 19
 dashedName: how-does-inline-block-work
 ---

 # --description--

-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-How does `inline-block` work, and how does it differ from inline and block elements?
-
 When working with CSS, you often encounter three different types of display behaviors for elements: `inline`, `block`, and `inline-block`.

 Each of these properties affects how elements are positioned and how they interact with other elements on the page.
@@ -1,19 +1,12 @@
 ---
 id: 672acc538e6ef24e9dd3c94f
 title: What Are Margins and Padding, and How Do They Work?
-challengeType: 11
-videoId: Y3kOn6bRWRQ
+challengeType: 19
 dashedName: what-are-margins-and-padding
 ---

 # --description--

-Watch the video or read the transcript and answer the questions below.
-
-# --transcript--
-
-What are margins and padding, and how do they work?
-
 Margin and padding are essential properties in CSS for creating well-structured, readable, and visually appealing web pages.

 Margins control the space outside an element, helping to separate it from other elements and define the layout structure, while padding controls the space inside an element, improving content readability and aesthetic appeal.