This is a migrated thread and some comments may be shown as answers.

Positioning controls inside a panel

2 Answers 542 Views
Window
This is a migrated thread and some comments may be shown as answers.
Charles Reid
Top achievements
Rank 1
Charles Reid asked on 01 Feb 2012, 02:47 PM
I am trying to use the radWindow to represent equipment.  I don't know if it will work or what other control might work.  What I need to do is add a panel to the radWindow and then show controls (other panels, images, and text) inside the panel based on locations inside the panel.  I can get the initial panel to display properly, but when I try to add controls to the panel they display based on 'static' positioning.  If I try to set the positioning to 'absolute', the entire panel draws over top of the radWindow.  I assume this is due to the rendering of the radWindow itself.  Is this even possible?  Is there a better rad control to use?

Browser = Chrome 16.0.
OS = Windows 7.
Target = .Net 3.5
Language = C#

2 Answers, 1 is accepted

Sort by
0
Marin Bratanov
Telerik team
answered on 02 Feb 2012, 05:38 PM
Hello,

Please examine the following example:
<telerik:RadWindow runat="server" ID="rw1" VisibleOnPageLoad="true">
    <ContentTemplate>
        <asp:Panel ID="Panel1" runat="server" Style="position: relative; border: 1px solid blue;">
            some other content
            <br />
            that is inside the main container
            <asp:Panel ID="Panel2" runat="server" Style="position: absolute; top: 50px; left: 50px;
                width: 100px; height: 100px; border: 1px solid red;">
                an element that is positioned relatively to the main container
            </asp:Panel>
        </asp:Panel>
    </ContentTemplate>
</telerik:RadWindow>

Note how the main panel has relative position set. This allow the second panel to calculate its absolute position according to it, not to the Radwindow. This is how absolute positioning works, it is relative to the first parent that is not static in the page, which originally is the RadWindow's wrapper.

I am attaching a screenshot how this works on my end. I hope this is the desired behavior.

All the best,
Marin
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
0
Charles Reid
Top achievements
Rank 1
answered on 02 Feb 2012, 07:55 PM
Thanks for the reply.  I had solved the problem, I thought, with similar code.  I added a panel within a panel but the absolute positioning seemed to always go to the top left of the radWindow.  I ended up using relative positioning for all the panels, which made positioning them problematic.  I think the difference between your code and mine is that i didn't specify the initial panel as 'position:relative'.  In any event I am using your solution since it allows me to use 'position:absolute' which is much easier to code in the long run.

Thanks again.

Charles
Tags
Window
Asked by
Charles Reid
Top achievements
Rank 1
Answers by
Marin Bratanov
Telerik team
Charles Reid
Top achievements
Rank 1
Share this question
or