# FlexLayoutPanel

The `FlexLayoutPanel` arranges its child controls using the layout engine specified in the `LayoutStyle` property. When set to `Default`, child controls are arranged using the default layout engine, using their location, dock style, and anchor properties.

When the `LayoutStyle` property is set to `Horizontal`, child controls are arranged horizontally in a single row.

When the `LayoutStyle` property is set to `Vertical`, child controls are arranged vertically in a single column.

{% hint style="info" %}
For a full list of properties, methods and events see the [API documentation.](http://docs.wisej.com/api)
{% endhint %}

## Features

### AutoSize

When enabled, the `FlexLayoutPanel` control resizes itself to fit its contents according to the `AutoSizeMode` property specified.

{% content-ref url="../../concepts/layouts" %}
[layouts](https://docs.wisej.com/docs/concepts/layouts)
{% endcontent-ref %}

## Advanced

### JavaScript Widget

| Item                | Description                                                                                                                                                                                                                                                                             |
| ------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| Class name          | "wisej.web.Panel"                                                                                                                                                                                                                                                                       |
| Theme appearance    | "panel", see [Themes](https://docs.wisej.com/theme-builder/theme-elements/elements).                                                                                                                                                                                                    |
| Child components    | "pane" is the container. "captionbar" is the header. "title" is the title of the panel. "icon" is the icon of the panel, if applicable. "close-button" is the close button of the panel, if applicable. See [JavaScript](https://docs.wisej.com/docs/concepts/javascript-object-model). |
| Toolcontainer state | "panel", see [Embedded Tools](https://docs.wisej.com/docs/controls/general/embedded-tools).                                                                                                                                                                                             |
| Source code         | [https://github.com/iceteagroup/wisej-js](https://github.com/iceteagroup/wisej-js/blob/master/wisej.web.TextBox.js)                                                                                                                                                                     |