> For the complete documentation index, see [llms.txt](https://docs.devolutions.net/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.devolutions.net/powershell-universal/da/powershell-kommandoer/new-udgrid.md).

# New-UDGrid

New-UDGrid opretter et responsivt layoutgitter med 12 punkter i PowerShell Universal, der tilpasser placeringen af komponenter til visningsskærmens størrelse.

### Synopsis

Gitteret er et 12-punkts gittersystem, der kan tilpasse sig ud fra størrelsen på den skærm, der viser kontrolelementerne.

### Syntaks

```powershell
New-UDGrid [-Id <String>] [-ExtraSmallSize <Int32>] [-SmallSize <Int32>] [-MediumSize <Int32>] [-LargeSize <Int32>] [-ExtraLargeSize <Int32>] [-Item] [-Children <ScriptBlock>] [-ClassName <String>] [-Direction <String>] [-RowSpacing <Object>] [-ColumnSpacing <Object>] [-JustifyContent <String>] [-AlignItems <String>] [-Version <String>] [-Style <Hashtable>] [<CommonParameters>]

New-UDGrid [-Id <String>] [-Container] [-Spacing <Int32>] [-Children <ScriptBlock>] [-ClassName <String>] [-Direction <String>] [-RowSpacing <Object>] [-ColumnSpacing <Object>] [-JustifyContent <String>] [-AlignItems <String>] [-Version <String>] [-Style <Hashtable>] [<CommonParameters>]
```

### Beskrivelse

Opretter et gitter til layout af komponenter. Gitteret er et 12-punkts gittersystem, der kan tilpasse sig ud fra størrelsen på den skærm, der viser kontrolelementerne.

### Parametre

#### -Id

Id for komponenten. Standardværdien er et tilfældigt GUID.

```
Required?                    false
Position?                    named
Default value                [Guid]::NewGuid().ToString()
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -ExtraSmallSize

Størrelsen (1-12) for ekstra små enheder.

```
Required?                    false
Position?                    named
Default value                0
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -SmallSize

Størrelsen (1-12) for små enheder.

```
Required?                    false
Position?                    named
Default value                0
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -MediumSize

Størrelsen (1-12) for mellemstore enheder.

```
Required?                    false
Position?                    named
Default value                0
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -LargeSize

Størrelsen (1-12) for store enheder.

```
Required?                    false
Position?                    named
Default value                0
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -ExtraLargeSize

Størrelsen (1-12) for ekstra store enheder.

```
Required?                    false
Position?                    named
Default value                0
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -Container

Om dette er en container. En container kan bedst beskrives som en række.

```
Required?                    false
Position?                    named
Default value                False
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -Spacing

Afstand mellem elementerne.

```
Required?                    false
Position?                    named
Default value                0
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -Item

Om dette er et element i en container.

```
Required?                    false
Position?                    named
Default value                False
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -Children

Komponenter, der indgår i dette gitterelement.

```
Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -ClassName

En CSS-klasse, der skal anvendes på gitteret.

```
Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -Direction

Gitterets retning. Kan være row, column, row-reverse eller column-reverse.

```
Required?                    false
Position?                    named
Default value                row
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -RowSpacing

Afstanden mellem rækkerne.

```
Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -ColumnSpacing

Afstanden mellem kolonnerne.

```
Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -JustifyContent

Justeringen af gitterelementerne langs hovedaksen. Kan være flex-start, flex-end, center, space-between, space-around eller space-evenly.

```
Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -AlignItems

Justeringen af gitterelementerne langs tværaksen. Kan være flex-start, flex-end, center, baseline eller stretch.

```
Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -Version

```
Required?                    false
Position?                    named
Default value                1
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### -Style

```
Required?                    false
Position?                    named
Default value
Accept pipeline input?       false
Aliases
Accept wildcard characters?  false
```

#### Fælles parametre

Denne cmdlet understøtter de fælles parametre: Verbose, Debug, ErrorAction, ErrorVariable, WarningAction, WarningVariable, OutBuffer, PipelineVariable og OutVariable. Se [about\_CommonParameters](https://go.microsoft.com/fwlink/?LinkID=113216) for at få flere oplysninger.

### Output

### Eksempler

#### Eksempel 1: grundlæggende gitter

```powershell
New-UDGrid -Container -Children {
    New-UDGrid -Item -ExtraSmallSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 1"
       }
   }
    New-UDGrid -Item -ExtraSmallSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 2"
       }
   }
    New-UDGrid -Item -ExtraSmallSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 3"
       }
   }
} -Id "grid1"
```

Et grundlæggende gitter med 3 kort i en række.

#### Eksempel 2: responsivt gitter

```powershell
New-UDGrid -Container -Children {
    New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 1"
       }
   }
    New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4  -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 2"
       }
   }
    New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 3"
       }
   }
} -Id "grid2"
```

Et responsivt gitter med 3 kort i en række. Kortene stables på små enhedsskærme.

#### Eksempel 3: gitterafstand

```powershell
New-UDDynamic -Id 'grid4' -Content {
   $Spacing = (Get-UDElement -Id 'gridSpacingSelect').value
   New-UDGrid -Container -Children {
     New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 1"
       }
   }
    New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4  -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 2"
       }
   }
   New-UDGrid -Item -ExtraSmallSize 12 -LargeSize 4 -Children {
       New-UDCard -Title "Card 1" -Content {
           New-UDButton -Text "Button 3"
       }
   }
  } -Spacing $Spacing
}
New-UDSelect -Id 'gridSpacingSelect' -Label Spacing -Option {
  for ($i = 0; $i -lt 10; $i++) {
      New-UDSelectOption -Name $i -Value $i
  }
} -OnChange { Sync-UDElement -Id 'grid4' } -DefaultValue 3
```

Et responsivt gitter med 3 kort i en række. Afstanden mellem kortene kan ændres med select-boksen.

#### Eksempel 4: række og kolonner

```powershell
New-UDRow -Columns {
    New-UDColumn -Size 4 -Content {
        New-UDCard -Title "Card 1" -Content {}
    }
    New-UDColumn -Size 4 -Content {
        New-UDCard -Title "Card 2" -Content {}
    }
    New-UDColumn -Size 4 -Content {
        New-UDCard -Title "Card 3" -Content {}
    }
} -Id 'grid5'
```

Række- og kolonnealiaserne kan bruges til at oprette et gitter.

#### Eksempel 5: justering

```powershell
$Session:direction = 'row'
$Session:justifyContent = 'center'
$Session:alignItems = 'center'
New-UDSelect -Label 'direction' -Option {
    New-UDSelectOption -Name 'row'
    New-UDSelectOption -Name 'row-reverse'
    New-UDSelectOption -Name 'column'
    New-UDSelectOption -Name 'column-reverse'
} -DefaultValue 'row' -OnChange {
    $Session:direction = $EventData
    Sync-UDElement -Id 'example'
}
New-UDSelect -Label 'justifyContent' -Option {
    New-UDSelectOption -Name 'flex-start'
    New-UDSelectOption -Name 'center'
    New-UDSelectOption -Name 'flex-end'
    New-UDSelectOption -Name 'space-between'
    New-UDSelectOption -Name 'space-around'
    New-UDSelectOption -Name 'space-evenly'
} -DefaultValue 'center' -OnChange {
    $Session:justifyContent = $EventData
    Sync-UDElement -Id 'example'
}
New-UDSelect -Label 'alignItems' -Option {
    New-UDSelectOption -Name 'flex-start'
    New-UDSelectOption -Name 'center'
    New-UDSelectOption -Name 'flex-end'
    New-UDSelectOption -Name 'stretch'
    New-UDSelectOption -Name 'baseline'
} -DefaultValue 'center' -OnChange {
    $Session:alignItems = $EventData
    Sync-UDElement -Id 'example'
}
New-UDDynamic -Id 'example' -Content {
    New-UDGrid -Container -Children {
        New-UDGrid -Item -Children {
            New-UDPaper -Children { "Cell 1" } -Style @{
                backgroundColor = 'rgb(26, 32, 39)'
                color           = 'white'
            }
        }
        New-UDGrid -Item -Children {
            New-UDPaper -Children { "Cell 2" } -Style @{
                backgroundColor = 'rgb(26, 32, 39)'
                color           = 'white'
            }
        }
        New-UDGrid -Item -Children {
            New-UDPaper -Children { "Cell 3" } -Style @{
                backgroundColor = 'rgb(26, 32, 39)'
                color           = 'white'
            }
        }
    } -Direction $Session:Direction -JustifyContent $Session:justifyContent -AlignItems $Session:alignItems
}
```

Justeringen af gitterelementerne kan ændres med parametrene direction, justifyContent og alignItems.

\[Component("Grid", "Grid", "Creates a new card.")]


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.devolutions.net/powershell-universal/da/powershell-kommandoer/new-udgrid.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.