Hi,
I've just installed the new Q2 version of the controls and in the main all is fine. I have however noticed that in Chrome I end up with an extra margin inside a RadSplitter. So I tried to inspect the CSS with Chrome, as soon as I try the margin collapses and the page looks as it should. I've deleted as much as possible on the page to get to a working example. The following code works in Chrome, you should see a left blue column, the right column has some text, the text appears maybe 15-20px away from the blue panel, if you now open it up for inspection the margin disappears.
Note that if you refresh the page with the inspector open in chrome then the margin appears for half a second or so then disappears.
Regards,
Jon
I've just installed the new Q2 version of the controls and in the main all is fine. I have however noticed that in Chrome I end up with an extra margin inside a RadSplitter. So I tried to inspect the CSS with Chrome, as soon as I try the margin collapses and the page looks as it should. I've deleted as much as possible on the page to get to a working example. The following code works in Chrome, you should see a left blue column, the right column has some text, the text appears maybe 15-20px away from the blue panel, if you now open it up for inspection the margin disappears.
Note that if you refresh the page with the inspector open in chrome then the margin appears for half a second or so then disappears.
Regards,
Jon
<html xmlns="http://www.w3.org/1999/xhtml" ><head id="Head1" runat="server"> <title></title> <style type="text/css"> html, body, form { height: 100%; margin: 0px; padding: 0px; overflow: hidden; } .surroundPaneBackground { background-color: #8ba0bc; height: 100%; width: 100%; } </style></head><body> <form id="form1" runat="server"> <telerik:RadStyleSheetManager ID="pgRadStyleSheetManager" runat="server"></telerik:RadStyleSheetManager> <telerik:RadScriptManager ID="pgRadScriptManager" runat="server"></telerik:RadScriptManager> <div id="ParentDivElement" style="height: 100%;"> <telerik:RadSplitter ID="uxRadSplitter" runat="server" Height="100%" Width="100%" Orientation="Vertical" LiveResize="true" BorderSize="0"> <telerik:RadPane ID="uxRadPaneLeft" runat="server" MinWidth="0"><div class="surroundPaneBackground"></div></telerik:RadPane> <telerik:RadPane ID="uxRadPaneMain" runat="server" Scrolling="none" Width="850"> <telerik:RadSplitter ID="RadSplitter1" runat="server" Height="100%" Orientation="Horizontal" LiveResize="true" BorderSize="0"> <telerik:RadPane ID="uxRadPaneContent" runat="server" Scrolling="none" > aaaa </telerik:RadPane> </telerik:RadSplitter> </telerik:RadPane> </telerik:RadSplitter> </div> </form></body></html>4 Answers, 1 is accepted
0
Hi Jon,
We are aware of this behavior. However, we have not been able to locate the exact cause of the issue. The problem seems to be an incorrect rendering of the fixed sized and relative (percentage) sized elements by the browser's engine but so far we were unable to isolate the exact issue.
As a workaround for this behavior, I would suggest you to disable the scrolling for the pane containing the nested div. To do so, you need to set the pane's Scrolling property to None.
Regards,
Dobromir
the Telerik team
We are aware of this behavior. However, we have not been able to locate the exact cause of the issue. The problem seems to be an incorrect rendering of the fixed sized and relative (percentage) sized elements by the browser's engine but so far we were unable to isolate the exact issue.
As a workaround for this behavior, I would suggest you to disable the scrolling for the pane containing the nested div. To do so, you need to set the pane's Scrolling property to None.
Regards,
Dobromir
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
Jon
Top achievements
Rank 1
Rank 1
answered on 18 Jun 2012, 11:04 AM
Hi Dobromir,
Many thanks for that - it worked a treat!
Best Regards,
Jon
Many thanks for that - it worked a treat!
Best Regards,
Jon
0
Martin Roussel
Top achievements
Rank 1
Rank 1
answered on 30 Oct 2012, 06:18 PM
Hi, I was wondering if this issue was fixed in Q3 2012 as Im experiencing extra margin problems with Chrome using the RadSplitter. This cause appearance of extra horizontal and vertical sliders that are not wanted. I also cant use the mentioned workaround since I need the panes to be scrollable.
Thank you
Thank you
0
Hi Martin,
Unfortunately we are still not able to detect the exact reason for this behavior and I cannot give you a firm estimate when it will be resolved.
All the best,
Vesi
the Telerik team
Unfortunately we are still not able to detect the exact reason for this behavior and I cannot give you a firm estimate when it will be resolved.
All the best,
Vesi
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.