Align items in UDCard

You can use a flex container to do this. The New-UDRight function is from the tools module: PowerShell App Tools - PowerShell Module | PowerShell Universal

function New-UDRight {
    <#
    .SYNOPSIS
    Pull items to the right

    .DESCRIPTION
    Pull items to the right

    .PARAMETER Content
    The content to move to the right.
    #>
    [CmdletBinding()]
    param([ScriptBlock]$Content)

    New-UDElement -Tag 'div' -Content $Content -Attributes @{
        style = @{
            "display"         = "flex"
            "justify-content" = "flex-end"
            "margin-left"     = "auto"
            "margin-right"    = "0"
            "align-items"     = "flex-end"
        }
    }
}

New-UDApp -Content { 
    New-UDCard -Content {
        New-UDElement -Tag div -Content {
            New-UDTypography "Some Text" 
            New-UDRight -Content {
                New-UDChip -Label 100 -Size small 
            }
        } -Attributes @{
            style = @{
                display = 'flex'
            }
        }

    } 


}

thanks kind of worked (but have to changed a little bit)

New-UDElement -Tag div -Content {
                    New-UDTypography -Text "Computers with bitlocker ON:  "
                    New-UDElement -Tag div -Content {
                        
                    
                        New-UDChip -Label $bitlockeron -OnClick {
                            Set-UDClipboard -Data $bitlockeron
                            Show-UDToast "Copied to clipboard" -Position bottomRight
                        } -Size small
                    } -Attributes @{
                        style = @{
                            #"display"         = "flex"
                            "justify-content" = "flex-end"
                            "margin-left"     = "auto"
                            "margin-right"    = "0"
                            "align-items"     = "center"
                        }
                    }
                } -Attributes @{
                    style = @{
                        "display" = 'flex'
                        "align-items"     = "center"
                    }
                }

but the next problem is
im using pages not apps for this dash (app is main landing page and all other apps are pages in main app)
and as far as I know I am not allowed to use functions on the pages so I will have to use this code for every ud chip
and I have like 20 on this page - it will be a mess
Any cleaner solution ?
and for future deployments - maybe a more systemic solution for such needs ? just like align command for every graphical component ?

You could define a custom module with a function for this. It will be available throughout all apps and pages.

also i can add this function to main landing app (which I did) and it works in child pages
but anyway - maybe we can think of adding such behavior to the parameters of the graphical elements in future releases,