# The element hierarchy
## Components
A Bubble page consists of three types of components:
### **The page**
The page is the top-level component of a webpage and is responsible for organizing the groups and elements on the page.
> The page is the top container for all elements
### **Containers/Groups**:
Groups are used to group elements together and control their layout. They can be thought of as "boxes" that hold other elements. They can be styled or they can be invisible to the user and can contain Elements and even other Groups to create a hierarchy. Groups are a major part of your page's design as they determine how your other elements behave.
> Groups are containers for elements and for sub-groups
### **Elements**
Elements are the actual content that your users see and interact with to work with your app, such as buttons, links, images, icons and input fields.
> Elements are the things that users interact with on the page
## The hierarchy
The way in which these components are organized and styled determines the overall layout and design. From a technical viewpoint they make up the page's hierarchy structure.
It helps to see it in a schematic form:\
In a way, the hierarchy above is how your browser "sees" the page before rendering the results on the screen.
---
# 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://manual.bubble.io/help-guides/design/elements/the-element-hierarchy.md?ask=
```
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.