fix: add missing hint for 'improve compatibility with browser fallbacks' article (#34728)
This commit is contained in:
committed by
Quincy Larson
parent
2f4765dfdf
commit
5753263d43
@ -0,0 +1,37 @@
|
|||||||
|
---
|
||||||
|
title: Improve Compatibility with Browser Fallbacks
|
||||||
|
---
|
||||||
|
## Improve Compatibility with Browser Fallbacks
|
||||||
|
|
||||||
|
<!-- The article goes here, in GitHub-flavored Markdown. Feel free to add YouTube videos, images, and CodePen/JSBin embeds -->
|
||||||
|
We need to add a fallback to the ```background``` property of the ```.black-box`` class.
|
||||||
|
|
||||||
|
### Example
|
||||||
|
|
||||||
|
```css
|
||||||
|
:root {
|
||||||
|
--black-color: black;
|
||||||
|
}
|
||||||
|
.black-box {
|
||||||
|
background: var(--black-color);
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
|
## Solution
|
||||||
|
|
||||||
|
Add a fallback to the ```background``` property before the existing background declaration:
|
||||||
|
|
||||||
|
```css
|
||||||
|
:root {
|
||||||
|
--black-color: black;
|
||||||
|
}
|
||||||
|
.black-box {
|
||||||
|
background: black;
|
||||||
|
background: var(--black-color);
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
Reference in New Issue
Block a user