Get rid of Rad columns space

[Chamara]

Hi,

I have the following layout structure.

    <telerik:RadPageLayout ID="rplReportsPage" runat="server" GridType="Fluid">
      <rows>
        <telerik:LayoutRow  HtmlTag="Div" WrapperHtmlTag="Div">
              <Columns>
                <telerik:LayoutColumn Span="12">
                    <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" />
                    <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel1">
                        <div id="dataDiv" runat="server"></div>
                    </telerik:RadAjaxPanel>
                </telerik:LayoutColumn>
            </Columns>
        </telerik:LayoutRow>
    </rows>
    </telerik:RadPageLayout> 

Following code in the backend (This is only a part of the backend code )

 

  LayoutColumn rLayoutColumn = new LayoutColumn();
  RadListView listView = DefineListViewStructure(parentItemCount, gridHeaderText);
  listView.DataSource = dt;
  listView.DataBind();

   rLayoutColumn.Controls.Add(listView);   
   dataDiv.Controls.Add(rLayoutColumn);

 

Code generates a view like in the attached file. I want to get rid of the highlighted space in the column and place the boxes right below each other. How can I do that?

 

 

 

 

[Rumen]

Hello Chamara,

The layout that you have defined contains a single LayoutRow, which renders a div container for the whole rendered row. As you know the div element is resized to fit the contents in it and its height depends on the height of the tallest element in it. There is no way to configure a <div> element to surround without space all elements with different height.

What you need to do is to build a layout without rows or different rows for the different columns (see Figure 1. RadPageLayout control demonstrating how to use rows and columns in the Rows article).

Best regards,
Rumen
Progress Telerik