> ## Documentation Index
> Fetch the complete documentation index at: https://docs.landerlab.io/llms.txt
> Use this file to discover all available pages before exploring further.

# Abmessungen und Größe von Elementen steuern

> Passen Sie die Abmessungen von Elementen an, um Breite, Höhe und Responsivität zu steuern und saubere, flexible Landingpage-Layouts zu gestalten.

Im Bereich Dimensions steuern Sie die **Größe jedes Elements auf Ihrer Arbeitsfläche**. Das hilft Ihnen, Layout, Abstände und Responsivität zu steuern.

Sie finden diese Einstellungen im **rechten Panel**, sobald Sie ein Element auswählen.

***

## Wo Sie es finden

1. Klicken Sie auf ein beliebiges Element auf der Arbeitsfläche
2. Wechseln Sie zum **rechten Panel**
3. Öffnen Sie den Bereich **Dimensions**

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/OxODOtVy1KOg0VAr/images/sizes.png?fit=max&auto=format&n=OxODOtVy1KOg0VAr&q=85&s=705a6a256803b04df8c147505c50015e" alt="Sizes" width="1306" height="988" data-path="images/sizes.png" />
</Frame>

***

## Größensteuerung

### Width

Steuert, wie breit das Element ist.

### Height

Steuert, wie hoch das Element ist.

***

## Die Einheiten erklärt

Beim Festlegen von Breite oder Höhe stehen Ihnen verschiedene Einheiten zur Wahl:

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/OxODOtVy1KOg0VAr/images/image-7.png?fit=max&auto=format&n=OxODOtVy1KOg0VAr&q=85&s=f31fcf19b3ae1fd9797b6520f523bfd1" alt="Image" width="292" height="319" data-path="images/image-7.png" />
</Frame>

### px (Pixel)

* Feste Größe
* Ändert sich nicht je nach Bildschirm
* Am besten für präzise Kontrolle

### % (Prozent)

* Relativ zum übergeordneten Container
* Responsiv und flexibel
* Am besten für Layouts, die sich an die Bildschirmgröße anpassen

### Fit

* Passt sich automatisch dem Inhalt an
* Das Element wächst oder schrumpft je nach Inhalt

***

## Erweiterte Optionen

Klicken Sie auf **More Options**, um Zugriff zu erhalten auf:

<Frame>
  <img src="https://mintcdn.com/landerlab-babdc23f/OxODOtVy1KOg0VAr/images/image-8.png?fit=max&auto=format&n=OxODOtVy1KOg0VAr&q=85&s=979d94a0d85cf73a9ce230c967d4403e" alt="Image" width="285" height="364" data-path="images/image-8.png" />
</Frame>

### Min Width / Min Height

* Legt die kleinstmögliche Größe des Elements fest

### Max Width / Max Height

* Legt die größtmögliche Größe fest, auf die das Element anwachsen darf

***

## Beispiel

* Width → `100%`
* Max Width → `600px`

👉 Das Element dehnt sich auf kleineren Bildschirmen aus, bleibt auf größeren Bildschirmen aber innerhalb von 600 px.

***

## Bewährte Vorgehensweisen

* Nutzen Sie **%** für responsive Layouts
* Nutzen Sie **px** für exakte Kontrolle
* Nutzen Sie **Fit**, wenn die Inhaltsgröße das Element bestimmen soll
* Setzen Sie eine **maximale Breite**, damit Layouts auf großen Bildschirmen aufgeräumt bleiben