DxFormLayoutGroup.CssClass Property

Specifies the name of the CSS class applied to the group.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v21.1.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public string CssClass { get; set; }

Property Value

Type	Description
String	A CSS class name.

Remarks

Use the CssClass property to apply a CSS class to a Form Layout group.

<style>
    .my-class {
        color: blue;
    }
</style>

<DxFormLayout Data="forecast">
    <DxFormLayoutGroup Caption="Weather Forecast" CssClass="my-class">
        <DxFormLayoutItem Caption="Date" Field="@nameof(WeatherForecast.Date)" ReadOnly="true" />
        <DxFormLayoutItem Caption="Temperature" Field="@nameof(WeatherForecast.TemperatureC)" Enabled="false" />
    </DxFormLayoutGroup>
</DxFormLayout>

@code {
    public class WeatherForecast
    {
        public DateTime Date { get; set; }
        public int TemperatureC { get; set; }
    }

    WeatherForecast forecast = new WeatherForecast()
    {
        Date = new DateTime(2020, 05, 11),
        TemperatureC = 20,
    };
}

To customize only the group’s header, use the HeaderTemplate and HeaderCssClass properties.

Refer to following topic for more information: CSS Classes.