Columns show as rows

7 posts, 1 answers
  1. Al
    Al avatar
    221 posts
    Member since:
    Oct 2006

    Posted 01 Dec 2014 Link to this post

    Hi,
    Perhaps I don't understand this control but the code below produces two buttons one below the other but I'd expect the buttons to be next to each other?

    <telerik:RadPageLayout ID="RadPageLayout1" runat="server" >
        <Rows>
            <telerik:LayoutRow ID="LayoutRow2" runat="server" AccessKey="" HiddenLg="False" HiddenMd="False" HiddenSm="False" HiddenXl="False" HiddenXs="False" HtmlTag="Div" RowType="Row" ToolTip="" WrapperHtmlTag="None">
                <Columns>
                    <telerik:LayoutColumn ID="LayoutColumn3" runat="server" AccessKey="" HiddenLg="False" HiddenMd="False" HiddenSm="False" HiddenXl="False" HiddenXs="False" HtmlTag="Div" Offset="-1" OffsetLg="-1" OffsetMd="-1" OffsetSm="-1" OffsetXl="-1" OffsetXs="-1" Pull="-1" PullLg="-1" PullMd="-1" PullSm="-1" PullXl="-1" PullXs="-1" Push="-1" PushLg="-1" PushMd="-1" PushSm="-1" PushXl="-1" PushXs="-1" Span="12" SpanLg="0" SpanMd="0" SpanSm="0" SpanXl="0" SpanXs="0" ToolTip="">
                        <telerik:RadButton ID="RadButton2" runat="server" Text="RadButton"></telerik:RadButton>   
                    </telerik:LayoutColumn>
                    <telerik:LayoutColumn ID="LayoutColumn4" runat="server" AccessKey="" HiddenLg="False" HiddenMd="False" HiddenSm="False" HiddenXl="False" HiddenXs="False" HtmlTag="Div" Offset="-1" OffsetLg="-1" OffsetMd="-1" OffsetSm="-1" OffsetXl="-1" OffsetXs="-1" Pull="-1" PullLg="-1" PullMd="-1" PullSm="-1" PullXl="-1" PullXs="-1" Push="-1" PushLg="-1" PushMd="-1" PushSm="-1" PushXl="-1" PushXs="-1" Span="12" SpanLg="0" SpanMd="0" SpanSm="0" SpanXl="0" SpanXs="0" ToolTip="">
                        <telerik:RadButton ID="RadButton1" runat="server" Text="RadButton"></telerik:RadButton>   
                    </telerik:LayoutColumn>
                </Columns>
            </telerik:LayoutRow>
        </Rows>
    </telerik:RadPageLayout>

  2. Magdalena
    Admin
    Magdalena avatar
    487 posts

    Posted 01 Dec 2014 Link to this post

    Hello Al,

    The RadPageLayout uses grid system for displaying the layout. The maximum number of columns is 12. The span attribute sets the size (or width) of a column, so the sum of the values for all spans in a single row can be up to 12 units. If you would like to make the buttons to be next to each other, please set smaller values to he Span attributes of the columns, so the sum will be up to 12.

    Regards,
    Magdalena
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  3. Al
    Al avatar
    221 posts
    Member since:
    Oct 2006

    Posted 01 Dec 2014 in reply to Magdalena Link to this post

    Thanks Magdalena, I understand and I have it working fine now in the browser. In design view it doesn't display correctly though - should it?
  4. Magdalena
    Admin
    Magdalena avatar
    487 posts

    Posted 02 Dec 2014 Link to this post

    Hello Alwin,

    Actually this is a limitation of the RadPageLayout and it is not possible to implement this functionality for this moment.

    Regards,
    Magdalena
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  5. Answer
    Magdalena
    Admin
    Magdalena avatar
    487 posts

    Posted 02 Dec 2014 Link to this post

    Hello Al,

    Actually this is a limitation of the RadPageLayout and it is not possible to implement this functionality for this moment.

    Regards,
    Magdalena
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
  6. Allen
    Allen avatar
    66 posts
    Member since:
    Mar 2011

    Posted 26 Aug in reply to Magdalena Link to this post

    Any change in this limitation?  Not being able to get even a guess about the rendered appearance makes the thing  very hard to use for designing forms.
  7. Peter Milchev
    Admin
    Peter Milchev avatar
    615 posts

    Posted 28 Aug Link to this post

    Hello Allen,

    I am afraid that the design-time limitations are still present with the PageLayout. 

    Generally, the Design time uses an engine similar to a very old version of Internet Explorer and it not all styles and HTML elements are rendered properly in it. That is why, sometimes some of the styles are not reflected in the design-time while they are applied in the real browser. 

    We strongly recommend testing such appearance tasks in the real browser. In the modern browsers, such as Google Chrome and Mozilla Firefox, the developer tools provided by the browser allow a very easy inspection and tweaking of CSS styles, HTML attributes and DOM elements hierarchy. More info can be found in the following blog post, mainly the first two points:

    Regards,
    Peter Milchev
    Progress Telerik

    Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Back to Top