Blazor Card Example - Horizontal Card

Card / Cards / Horizontal Card

This sample demonstrates Card rendering with a horizontal layout. Based on the horizontal structure, the product Card is shown with detailed information.

Loading Syncfusion Blazor Server Demos…

iPhone X
iPhone X
Marketed by Apple Inc
The iPhone X has a 5.8-inch diagonal OLED color-accurate screen and two cameras on the rear. One is a 12-megapixel with support for face detection. It is capable of capturing 4K video at 24, 30 or 60 frames per second. It supports Qi-standard wireless charging.
Philips Trimmer
Philips trimmers are designed to last longer than 4 ordinary trimmers and DuraPower Technology which optimizes power.
Trimmer
Camera
Canon 135mm
The fastest 135mm telephoto lens in its class. Two UD-glass elements correct secondary spectrum for outstanding sharpness and color.

By default, Card elements are stacked one after another vertically. You can customize the Card with a specific direction by adding e-card-horizontal to align elements horizontally. Using e-card-stacked class, you can split the horizontal layout with a stacked element on the left or right of the card.

Transform your Blazor web apps today with Syncfusion® Blazor components
100+ high-performance and responsive UI components
Dedicated support
Hassle-free licensing
TRY IT FOR FREE