Skip to main content

Container

Containers can be used to group content that is related. Additionally, they emphasize and highlight your grouped content.

ContainerProps

Signature:

export declare type ContainerProps<E extends > = <E, >;

ContainerOwnProps

extends, , , , , ,
NameTypeDefaultDescription
variant?
| | |
'default'

The visual style of the container.

color?
| | | |
'neutral'

The color of the container. This should be chosen based on the context the container is used in.

SpacingProps

NameTypeDefaultDescription
padding?

Defines CSS padding property

p?

Defines CSS padding property

paddingX?

Defines CSS x padding property

px?

Defines CSS x padding property

paddingY?

Defines CSS y padding property

py?

Defines CSS y padding property

paddingTop?

Defines CSS top padding property

pt?

Defines CSS top padding property

paddingRight?

Defines CSS right padding property

pr?

Defines CSS right padding property

paddingBottom?

Defines CSS bottom padding property

pb?

Defines CSS bottom padding property

paddingLeft?

Defines CSS left padding property

pl?

Defines CSS left padding property

margin?

Defines CSS margin property

m?

Defines CSS margin property

marginX?

Defines CSS x margin property

mx?

Defines CSS x margin property

marginY?

Defines CSS y margin property

my?

Definesy CSS margin property

marginTop?

Defines CSS top margin property

mt?

Defines CSS top margin property

marginRight?

Defines CSS right margin property

mr?

Defines CSS right margin property

marginBottom?

Defines CSS bottom margin property

mb?

Defines bottom margin property

marginLeft?

Defines CSS left margin property

ml?

Defines CSS left margin property

LayoutSizeProps

NameTypeDefaultDescription
width?
[]

CSS width property

minWidth?
[]

CSS min width property

maxWidth?
[]

CSS max width property

height?
[]

CSS height property

minHeight?
[]

CSS min height property

maxHeight?
[]

CSS max height property

Still have questions?
Find answers in the Dynatrace Community