You can use this page to understand the legacy Span.CSSGrid setting and move ViewModel layout decisions to CSSGrid.
Status
Span.CSSGrid is deprecated. CSS Grid is now the default rendering approach, and Bootstrap is no longer available.
Do not add Span.CSSGrid to new ViewModels. For existing applications, review the CSS Grid setting at the ViewModel level instead.
What to use instead
Use the CSSGrid tagged value on the ViewModel when you need to state the rendering choice explicitly.
| Requirement | Setting | Result |
|---|---|---|
| Use the standard layout behavior | No explicit ViewModel override when CSS Grid is enabled by default | The application renders with CSS Grid. |
| Explicitly use CSS Grid for one ViewModel | CSSGrid=true on the ViewModel
|
The ViewModel renders HTML using CSS Grid rather than Bootstrap. |
| Override a server-wide CSS Grid default | CSSGrid=false on the ViewModel
|
The explicit ViewModel value overrides the default set in TurnkeySettings. |
For example, if the TurnkeySettings file contains:
<UseCSSGridByDefault>True</UseCSSGridByDefault>
then ViewModels use CSS Grid unless a ViewModel explicitly has CSSGrid=false.
Why Span.CSSGrid is no longer needed
CSS Grid places content using the CSS Grid values read from the ViewModel. This makes placement independent of Bootstrap and of the surrounding HTML context. A generic component can therefore be placed without the component needing to know where its HTML will appear.
The former Bootstrap layout system is deprecated. Do not use Bootstrap-specific layout guidance or settings, including Span.FixColSize, for new work.
Update an existing model
- Find ViewModels that use the legacy Span.CSSGrid setting.
- Remove the legacy setting from new or updated layout work.
- Decide whether the ViewModel needs an explicit override:
- Use
CSSGrid=truewhen the ViewModel must explicitly render with CSS Grid. - Use
CSSGrid=falseonly when you need to override a TurnkeySettings default.
- Use
- Check the application's TurnkeySettings for
UseCSSGridByDefaultto determine the default behavior. - Test the rendered ViewModel and adjust its CSS Grid placement values as required.
Styling after the Bootstrap transition
Bootstrap classes and Bootstrap-based layout behavior are not available. Keep layout decisions in CSS Grid, and use application CSS for visual styling. For guidance on adding style references and CSS classes from MDriven Designer, see Styling and CSS for Bootstrap, Angular and MVC.
