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.

Improve the way RadPageLayOut reacts to different view port sizes and make it consistent with the DeviceScreenSize detected with the Device Detection framework 

Rows and columns should have the same features - like in WPF.

Why not add Span and ColSpan to rows. It's a given that a row should default to 100% width of containing element.

RowSpan could set the width to that defined by the grid system - ie: Span 6 (of 12) is 50% width. The span could also be a hard-coded px value. Similar to using spans instead of divs in HTML.

ColSpan could interrogate the columns within the row and adopt their widths - ie: ColSpan 2 = same width as the 1st and 2nd columns combined.

Simply showing or hiding is not enough for good responsive design. 

Being able to reflow elements by setting ordinal positions is essential for mobile (and inline with Flexbox capabilities).

Centering is really a mandatory capability. Must be able to automatically center an element - such as a dialogue box of either a fixed size or one that automatically expands to it's contents.

Either in the whole page or within a row / column.

Combine fixed, auto and percentages:
In addition to setting percentages (as span is) - the ability to set a fixed size for a row or column and have the remaining space used by the remaining rows or columns either automatically (ie: share the rest equally) or by span/percentage. 
Similar to Flexbox or basic CSS {margin: 0 auto;}
Rows and columns should have the same features.

The Page Layout control is a great addition, but we're finding it's cumbersome to use in practice. When adding any other control to a row or column, the smart tags are not available and the control must be coded completely by hand.

We've gotten around this somewhat by creating controls OUTSIDE of the page layout, doing all the configuration, then moving them into the appropriate location inside the page layout control. The demo suggests that the tool can provide "Rapid Prototyping", but we're finding just the opposite.

As of now, the gutter (space between the columns) is hardcoded to 15 pixels.

Perhaps we could have a server side property, say Gutters, that accepts an integer value and results in a generated class, say t-gutter-10. We can also have predefined styles, say 10, 20, 15 etc so the base variants are covered.

If a developer wants, say 56 pixels gutter, it can be either set directly overwriting the styles or scoping trough the generated class t-gutter-56.

RadPageLayout is a big help on creating a responsive design however, I find it hassle on changing its contents since you must use Source view in Visual Studio, 2010 SP1 to be specific, while Design view only shows you the appearance of the content of the page layout and you cannot edit it right there. I was thinking if you have this already in mind, the capability of changing the contents of the page layout while in Design view in order to see the changes right away and also, to have the properties listed on the Properties pane for each row, column and so on.

If there are any other way I can do as alternative for now in order to modify the contents of a RadPageLayout with ease please let me know while waiting for the next release if this would have a good point in your evaluation. Thanks in advance!