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: Typos in lecture on Working with CSS Transforms, Overflow, and Filters (#64361)

Browse Source
This commit is contained in:
Brian Tripp
2025-12-08 03:33:44 -06:00
committed by GitHub
parent cabddb74cb
commit a09b4301de
2 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
curriculum/challenges/english/blocks/lecture-working-with-css-transforms-overflow-and-filters/672bcc8ccc976fd791610f43.md
+1 -1
View File
@@ -148,7 +148,7 @@ If you are using `transform` to hide or reveal content, make sure the content is
When applying `transform` to interactive elements like buttons or links, ensure that the clickable area remains intuitive and easily targetable. A drastically transformed button might be visually confusing or difficult to click especially for users with motor impairments.
In conclusion, while the CSS `transform` property is a powerful for creating visually dynamic web designs, it's essential to use it responsibly with accessibility in mind. Always test your transformed elements with various assisted technologies and consider providing alternative ways to access information or functionality that might be affected by transforms.
In conclusion, while the CSS `transform` property is a powerful tool for creating visually dynamic web designs, it's essential to use it responsibly with accessibility in mind. Always test your transformed elements with various assisted technologies and consider providing alternative ways to access information or functionality that might be affected by transforms.
# --questions--
curriculum/challenges/english/blocks/lecture-working-with-css-transforms-overflow-and-filters/672bcc9c4a6dd6d7dd3e6357.md
+4 -4
View File
@@ -21,7 +21,7 @@ This is an example with the `padding` shorthand property, where we set the top p
padding: 15px 5px 2px 8px;
```
The border is the outer edge or outline of an element in the CSS box model. It's the visual boundary of the element. You can customize the border style, width, color and other properties using the `border` property. Here's an example where we set the border to a width of five pixels, a solid state and a color of blue:
The border is the outer edge or outline of an element in the CSS box model. It's the visual boundary of the element. You can customize the border style, width, color and other properties using the `border` property. Here's an example where we set the border to a width of five pixels, the style to solid and a color of blue:
```css
border: 5px solid blue;
@@ -29,7 +29,7 @@ border: 5px solid blue;
If you omit a value the default property of that value will be used. That's `medium` for the width, `none` for the style and the current color for the color.
You can set this three properties directly in the shorthand `border` property if you want all sides to be exactly the same. But if you want to assign a different style to each side you can use the `border-width`, `border-style` and `border-color` properties.
You can set these three properties directly in the shorthand `border` property if you want all sides to be exactly the same. But if you want to assign a different style to each side you can use the `border-width`, `border-style` and `border-color` properties.
```css
border-width: 2px 4px 7px 12px;
@@ -37,7 +37,7 @@ border-style: dashed solid solid dashed;
border-color: blue red green black;
```
You can write up the four values for each one of these properties. They will be applied in a clockwise sequence starting from the top. If you only write one value it will be applied to all four sides.
You can write up to four values for each one of these properties. They will be applied in a clockwise sequence starting from the top. If you only write one value it will be applied to all four sides.
Finally, the margin is the space outside the border of an element. It determines the distance between an element and other elements around it. You can set different margin values for the top, right, bottom and left sides of the element using the `margin` property.
@@ -51,7 +51,7 @@ These four components are essential for calculating the total width and height o
In the next few lessons, you will learn more about how this is handled by the browser and how you can customize it. The CSS box model is a fundamental concept for web development.
Understanding how this component interact and contribute to an element's dimensions is essential for implementing web designs.
Understanding how these components interact and contribute to an element's dimensions is essential for implementing web designs.
# --questions--