gitadmin/freeCodeCamp
1
0
Fork 0
mirror of https://github.com/freeCodeCamp/freeCodeCamp.git synced 2026-05-28 18:26:54 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(curriculum): typo in lecture working with css transforms overflow and filters (#59990)

Browse Source
This commit is contained in:
Clarence
2025-04-25 08:03:01 +01:00
committed by GitHub
parent 126b60bc67
commit b7bdea5b23
2 changed files with 2 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
curriculum/challenges/english/25-front-end-development/lecture-working-with-css-transforms-overflow-and-filters/672bcc9c4a6dd6d7dd3e6357.md
+1 -1
View File
@@ -16,7 +16,7 @@ What is the CSS box model, and how does it work?
The CSS box model is a fundamental concept for web development. It defines how HTML elements are structured and positioned. If you understand this model you will be able to control the size, spacing and appearance of the elements on your website.
In the CSS box model, every element is sorrounded by a box. This box consists of four elements: the content area, the padding, the border, and the margin.
In the CSS box model, every element is surrounded by a box. This box consists of four elements: the content area, the padding, the border, and the margin.
The content area is the innermost part of the box. It's the space that contains the actual content of an element like text or images.
curriculum/challenges/english/25-front-end-development/lecture-working-with-css-transforms-overflow-and-filters/672bccc8ea33bad87abb3c56.md
+1 -1
View File
@@ -34,7 +34,7 @@ This property can be set on the universal selector (`*`) to apply to all the ele
The value of the `box-sizing` property is `content-box` by default, but you can choose `border-box` if you need to. We will explore `content-box` first and then we will go into `border-box`.
To understand how this models work, you need to be familiar with the four core concepts from the CSS box model. Let's review them quickly. The content area is the space occupied by the element's content. The padding is the space between the content area and the border. The border is the outline that sorrounds the content area and the padding. The margin is the space outside the border that separates the element from other elements.
To understand how this models work, you need to be familiar with the four core concepts from the CSS box model. Let's review them quickly. The content area is the space occupied by the element's content. The padding is the space between the content area and the border. The border is the outline that surrounds the content area and the padding. The margin is the space outside the border that separates the element from other elements.
In the `content-box` model, the width and height that you set for an element determines the dimensions of the content area but they don't include the padding, border or margin. You should use `content-box` when you need to have precise control over the dimensions of the content area. So, when you set the width and height of an element with `width` and `height` properties, you are only setting the dimensions of the content area. `width` is the width of the content, `height` is the height of the content.