# Z-Index guide

The `z-index` property specifies the stack order of an element. An element with greater stack order is always in front of an element with a lower stack order.

You can change `z-index` and order of elements by dragging them by the handle (see picture below). In this case you are changing `z-index` and also the order of option sets.

![](/files/-LlVahYXRrYBGS6myHWs)

&#x20;In this example, Frame will be the first option set and also the lowest element of the stack. As you see in the image below, wheels and tires are above the frame and this is incorrect.

![](/files/-LlVfsrZ2L1-B83qoKd3)

What if you want Frames as your first option set but still set `z-index` correctly? You can set `z-index` manually (see image below). In this case you need to set frames `z-index` to 3 and wheels and tires `z-index` to 2.

![](/files/-LlVh4Q_rlJvK3R04HkM)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.appclay.com/product-configurator/z-index-sorting.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
