Pending Review
Last Updated: 08 Aug 2018 04:38 by Kasim
ADMIN
Marin Bratanov
Created on: 07 Aug 2018 07:07
Category: PageLayout
Type: Feature Request
5
Height options for LayoutRow
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.
Attached Files:
1 comment
Kasim
Posted on: 08 Aug 2018 04:38
I know the requirement is definitely complex. However, if implemented with precision, will give a distinctive edge to Telerik responsive design over all other third parties development components available in the market.