# Labels

Allows a control to display a label without having to create a separate Label control.

When dropping a control that supports the associated label, you will find the Label field in the quick actions panel. Entering the label text automatically creates the associated label using the default properties.

![](/files/-MKl0OOxkCQ_435BLaoL)

You can change all the Label's properties either in the control's property panel or in code by using the **Control.Label** object.

![](/files/-MKl0r1yE_a-rdgDIvjW)

## Features

### Position

You can position the label to any of the four sides plus the *Inside* position. When the label is positioned inside, it is displayed over the editable control and automatically resized and moved up when the user enters a value or the application assigns the Text property.

![](/files/-MKl21jXeIb520e46_mo)

### AutoSizing

The internal layout of controls with the associated label is always managed by the widget and is controlled by these properties of the **Label** object: Text, Position, AllowHtml, Padding, Size, MaxSize, MinSize, and SizeType.

The outer size of the control is always the size set by the application - internally the label and the control share the outer size. You can control how much of the internal space is used by the label using the **SizeType** and **Size** properties:

* **AutoSize** (the default) means that the label occupies exactly the space it needs and the associated control uses the remaining space.
* **Absolute** means that the label occupies the number of pixels set in the **Size** property.
* **Percent** means that the label occupies the percentage of the space indicated in the **Size** property. Basically the Size property is either a pixel value or a percent value.

Additionally, you can constrain the size of the label by setting the **MinSize** and **MaxSize** properties, always in pixels.

### HTML

When the **AllowHtml** property is set to *true*, you can use any HTML string in the label to create labels of any complexity:

![\<big>\<big>\<big>\<big>👍\</big> \</big>\</big>\</big>Label \<big>\<big>\<big>\<big>\<b>Top](/files/-MKl4kHxCNBNoPIbc-zx)

### Mnemonics

Mnemonics are another feature that is common in desktop applications and generally completely forgotten in most web frameworks, except in Wisej.NET :grinning:

To assign a mnemonic character, type a **&** before the character that has become the mnemonic, set **UseMnemonic** to *true* and **AllowHtml** to *false*. Wisej.NET will render the mnemonic character underlined, which is the standard in desktop apps.

![Label = "\&Name"](/files/-MKl5P8SPq0XWUQTWvcb)

Users can now immediately focus the field simply by pressing Alt + Mnemonic character.

{% hint style="info" %}
The same mnemonic functionality is supported in the independent [Label ](/docs/controls/content/label.md)control. However, in the Label control case, the control that gains the focus when the mnemonic is pressed is the next focusable control in the tab order.
{% endhint %}

## Advanced

### Localization

Only the text of the label is localizable.

### Responsive

The properties of the **Label** object are not responsive. When the control is resized, the label widget will automatically adjust its internal space, but it's not capable of changing the location of the label or change any other property in conjunction with a [ClientProfile](/docs/concepts/client-profiles.md).

If you need to adjust any aspect of the label in relation to a responsive profile, handle the **Application.ResponsiveProfileChanged** event and change the properties in code.

### JavaScript Widget

Controls with the associated labels, when created in the browser, are wrapped inside an instance of the *wisej.web.LabelWrapper* JavaScript class.

{% hint style="danger" %}
JavaScript code that needs to interact with the editor control instead of the wrapper, should call **this.getEditor()** to get a reference to the wrapped editor control.
{% endhint %}

| Class name       | wisej.web.LabelWrapper                                                                                                |
| ---------------- | --------------------------------------------------------------------------------------------------------------------- |
| Theme appearance | "label-wrapper" see [Themes](https://docs.wisej.com/theme-builder/theme-elements/appearances)                         |
| Source code      | ​[https://github.com/iceteagroup/wisej-js](https://github.com/iceteagroup/wisej-js/blob/master/wisej.web.TextBox.js)​ |


---

# 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.wisej.com/docs/controls/general/labels.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.
