Pending Review
Last Updated: 08 Aug 2018 04:38 by Kasim
ADMIN
Created by: Marin Bratanov
Comments: 1
Category: PageLayout
Type: Feature Request
5
In the LayoutColumn we can easily set different Span which sets the width of the columns based on the viewport size. 

A similar implementation with LayoutRow is required where based on viewport size, the height of the respective row can be set.

Properties can be:
Height [Defaault Height of the Row]
HeightXl
HeightLg
HeightSm
etc..

One potential issue is that the content of the rows determines their height (and doing it differently can break the layouts): https://docs.telerik.com/devtools/aspnet-ajax/controls/pagelayout/structure/rows. Nevertheless, you can use their CssClass property and cascade through it in a @media query of your own that will provide the desired appearance. For example, you can place you own containers that will receive the necessary rules.

Another caveat is how to determine the height, especially when set in percent. The layout may be in a container that does not span the entire viewport, and height in percent poses a lot of requirements on the entire HTML structure outside of the control as well (all parent elements having explicit dimensions, and no sibling elements being present next to elements with height in percent).

Considering these potential issues, you can use the CSS solution attached below.