Blazor GridLayout - Overview

Trending articles
01
Camille Fournier
An incomplete list of skills senior engineers need
Nov 10
|
4 min read
02
Mathew MacDonald
A Closer Look at 5 New Features in C# 10
Nov 10
|
6 min read
03
Umair Haque
Welcome to a New Dark Age
Nov 10
|
9 min read
04
Anton Subbotin
Top 3 Coding Teachers
Nov 14
|
5 min read
05
Jean Campbell
An Open Letter to Millennials
Nov 15
|
7 min read
06
Camille Fournier
20 Necessary Requirements of a Perfect Laptop
Nov 17
|
4 min read
Recommended for you
Andreas Maier
Pattern Recognition and the Fundamental Methods of Machine Learning
A Comprehensive Overview of Classical ML Methods
Nov 11
|
7 min read
Pattern Recognition and the Fundamental Methods of Machine Learning
Photo by Nathan Van Egmond on Unsplash
Ali Tamaseb
What I Learned About Startups by Collecting 30,000 Data Points
I spend 4 years conducting one of the largest studies.
Nov 18
|
8 min read
What I Learned About Startups by Collecting 30,000 Data Points
Photo by Firmbee.com on Unsplash
Whet Moser
Our Climate Change Future Looks Like the Everglades
We are all Florida man.
Nov 21
|
6 min read
Our Climate Change Future Looks Like the Everglades
Events this month
Jan Feb Mar Apr
May Jun Jul Aug
Sep Oct Nov Dec
Discover more
Art
Books
Film
Gaming
Music
Photography
Podcasts
TV
Visual Design
  • Overview.razor
  • GridLayoutCardArticle.razor
  • GridLayoutArticleHeader.razor
  • GridLayoutArticle.cs
Loading the demo source code...please wait.

Style in ThemeBuilder

  • Custom SASS variables
  • Atomic customizations
  • Sharing projects
Start Theming
blazor ui ninja image

The GridLayout component is part of Telerik UI for Blazor, a professional grade UI library with 110+ native components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

Description

The Blazor UI GridLayout offers grid-layout system with rows and columns. It is based on a CSS Grid Layout. Within the Blazor Grid Layout, items could be configured per specific row and column and could span across them.

The component allows you to configure the spacing between its elements through dedicated RowSpacing and ColumnSpacing properties. You can also manage the alignment of the inner items of the Blazor Grid Layout based on the X and Y axis. The Grid Layout can be combined with the Telerik Blazor MediaQuery component to achieve responsive and adaptive layout.

The Blazor Grid Layout control is part of Telerik UI for Blazor, a comprehensive, professional-grade UI library for building modern and feature-rich applications. The Telerik UI for Blazor collection provides 110++ UI components which meet all app requirements for data handling, performance, UX, design, accessibility, and more.

This Blazor GridLayout Overview example is part of a unique collection of hundreds of Blazor demos, with which you can see all Telerik UI for Blazor components and their features in action. View the source code of the demos from the library or directly adapt, and edit them and their theme appearance in Telerik REPL for Blazor or ThemeBuilder.

Support & Learning Resources

Additional Resources

An error has occurred. This application may no longer respond until reloaded.