# Container The **Container** block is the cornerstone of all applications built on our No Code Platform for creating Telegram Mini Apps. It serves as the primary building block for structuring and organizing your app's content. By grouping and aligning other blocks within a Container, you can create complex and responsive layouts that enhance user experience. ## Content * [Inner blocks alignment](#inner-blocks-alignment) * [Horizontal alignment and distribution](#horizontal-alignment-and-distribution) * [Vertical alignment and distribution](#vertical-alignment-and-distribution) * [How to align vertical placed blocks by the center?](#how-to-align-vertical-placed-blocks-by-the-center) * [Fixation on the screen](#fixation-on-the-screen) * [Navigation (links or pages)](#navigation-links-and-pages) * [Image cover](#image-cover) * [Blur](#blur) * [Full screen sizing](#full-screen-sizing) ## Inner blocks alignment You can align inner blocks vertically or horizontally:

### Horizontal alignment and distribution When you align blocks horizontally, inner blocks are placed from the left to the right each after each:

Horizontal alignment of inner blocks of the container

In this case, you can distribute blocks (to the left, in the center, between the container, etc.):

Moreover, if inner blocks are different in size, you can move them between top and bottom corner of the container:

### Vertical alignment and distribution When blocks are aligned vertically, they are placed from the top to the bottom **by the left side**:

#### How to align vertical placed blocks by the center? To align vertically aligned blocks by the center, you need to add inner blocks and place blocks into them with the following structure:

In this case, blocks will be displayed like here:

### Navigation (links and pages) You can attach any link to the container:

Or you can [insert the link to another page to navigate between pages](/tgtaps-docs/features/navigation.md). ### Fixation on the screen The container can be fixed to the top or bottom side of the screen. This is needed to achieve “floating” effect for toolbar or bottom menu:

To make the container floating, select `isFixed`:

### Image cover You can upload an image to the background of your container:

Also, you need to select an image placement when the image is too big:

Keep in mind that containers do not have the own "size". Therefore, other blocks needs to be placed in the container. In the example we have an empty transparent block in the container:

### Blur Containers can be blurred:

Blur is used for floating components to make them more visible under other blocks:

### Full screen sizing You can make the height of the container to fix 100% of the screen:

If inner blocks take more space that the screen height, the height of the container will be increased. *** Something unclear in docs or you know how to improve article? [Message us in community!](https://docs.tgtaps.com/tgtaps-docs/readme/community)\ We will answer you and then promise to improve the article within 3 days. --- # 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://tgtaps.gitbook.io/tgtaps-docs/blocks/basic/quickstart.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.