z-index page #4553
z-index page #4553
Conversation
|
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
Co-authored-by: Tayyaba Taimur <[email protected]>
added some spacing
| priority: 4 | ||
| --- | ||
|
|
||
| Z-index is a CSS property that controls how certain components stack on top of each other. The stack order is defined by an element with greater z-index appearing in front of an element with a lower stack order. |
There was a problem hiding this comment.
What does "certain components" mean? This sentence mentions components then goes on to speak about elements. This is confusing
There was a problem hiding this comment.
Great point, thanks for the feedback. Will adjust this accordingly.
|
The Digram isn't a great one. You can google and see diagrams that show the stacking context from the perspective of the viewport. |
refined definition
| priority: 4 | ||
| --- | ||
|
|
||
| Z-index is a CSS property that controls how elements stack on top of each other. The stack order is defined by an element with a higher z-index appearing on top of an a element with a lower z-index. |
|
|
||
| Z-index is a CSS property that controls how elements stack on top of each other. The stack order is defined by an element with a higher z-index appearing on top of an a element with a lower z-index. | ||
|
|
||
| Z-index and shadow are used together to help distinguish each layer in the stack. Shadow provides the visual element and z-index provides the structural element. |
There was a problem hiding this comment.
Can we link to the Shadow foundation here?
There was a problem hiding this comment.
@amritadesmet could we add values to the stack order? The table shows lowest value to highest reading down the table, but the diagram would be showing the highest value at the top of the stack.
There was a problem hiding this comment.
Great point, yes will adjust accordingly.
In relation to #4481