Hello,
We have a width problem with rad spliiter. please see this screenshot, that demonstrate the problem.
If you look at the right edge of the page, you can see the letter T aligned to the right. as you can see, the letter is cut by 2 pixels or so. (zoom into the picture to see it clearly).
We have found out the following factors:
We have a width problem with rad spliiter. please see this screenshot, that demonstrate the problem.
If you look at the right edge of the page, you can see the letter T aligned to the right. as you can see, the letter is cut by 2 pixels or so. (zoom into the picture to see it clearly).
We have found out the following factors:
- the problem occures only when using nested radSplitters.
- the problem occures only for the inner radSplitter content.
- the problem occures only in SharePoint! this very weird. I have created the page in a regular web project in Visual Studio, and everything worked FINE. Then, I took that page, and put it inside SharePoint (no masterpage no additions, the exact same code). When run from within SharePoint the problem occures.
Here is the code I'm using:
| <%@ Page language="C#"%> |
| <%@ Register Assembly="Telerik.Web.UI, Version=2009.1.311.35, Culture=neutral, PublicKeyToken=121fae78165ba3d4" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> |
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head id="Head1" runat="server"> |
| <title></title> |
| <style type="text/css"> |
| html,body,form{ |
| height:100%; |
| } |
| </style> |
| </head> |
| <body> |
| <form id="form1" runat="server"> |
| <asp:ScriptManager ID="ScriptManager1" runat="server" /> |
| <telerik:RadSplitter runat="server" ID="mainSplitter" Width="100%" Height="100%" Orientation="Horizontal" BorderSize="0"> |
| <telerik:RadPane runat="server" ID="header" Height="120px" Width="100%"> |
| header |
| <div style="text-align:right"> |
| T |
| </div> |
| </telerik:RadPane> |
| <telerik:RadPane runat="server" ID="content" Scrolling="None" BorderWidth="1"> |
| <telerik:RadSplitter Orientation="Vertical" runat="server" ID="InternalSplitter" Height="100%" Skin="Default" EnableEmbeddedSkins="true" LiveResize="true" VisibleDuringInit="false" ResizeWithBrowserWindow="true" ResizeWithParentPane="true" > |
| <telerik:RadPane ID="ContentPane" runat="server" BorderWidth="1px" BorderColor="blue" BorderStyle="Solid"> |
| content |
| </telerik:RadPane> |
| <telerik:RadSplitBar runat="server" ID="r" CollapseMode="Backward" /> |
| <telerik:RadPane ID="SidePane" runat="server" Width="200px"> |
| <div style="text-align:right"> |
| T |
| </div> |
| side |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| </telerik:RadPane> |
| </telerik:RadSplitter> |
| </form> |
| </body> |
| </html> |
In order to reproduce the problem, please do one of the following:
Create an empty ASPX page in SharePoint Designer 2007, replace the auto generated code with my code, and run the page.
or
Save my code into an ASPX document, and the Upload that docment to a Document library in SharePoint. then, view the document.
Thanks,
Elad.
4 Answers, 1 is accepted
0
Hi Elad,
I trued to reproduce the issue but I am not completley sure whteher I could observe it very well because the difference is just 1 or 2 pixels and I could not get the result shown for your second "T" on the screenshot.
However, the problem I see comes from teh default inactive scrollbar IE adds - in order to get the desired result, please modify the html, body and element style in the following manner:
If scrollbars are needed, the splitter will generate them so hiding this unnecessary scrollbar will not afect the functionality but on teh contrary - you will get a better and cross-browser solution.
I also strongly recommend to upgrade to te latest Q2 2009 release - some calculation problems especially for nested splitters with BorderSize="0" were solved there.
Regards,
Svetlina
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
I trued to reproduce the issue but I am not completley sure whteher I could observe it very well because the difference is just 1 or 2 pixels and I could not get the result shown for your second "T" on the screenshot.
However, the problem I see comes from teh default inactive scrollbar IE adds - in order to get the desired result, please modify the html, body and element style in the following manner:
| <style type="text/css"> |
| html,body,form{ |
| height:100%; |
| padding: 0; |
| margin: 0; |
| overflow: hidden; |
| } |
| </style> |
If scrollbars are needed, the splitter will generate them so hiding this unnecessary scrollbar will not afect the functionality but on teh contrary - you will get a better and cross-browser solution.
I also strongly recommend to upgrade to te latest Q2 2009 release - some calculation problems especially for nested splitters with BorderSize="0" were solved there.
Regards,
Svetlina
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
0
Elad
Top achievements
Rank 1
Rank 1
answered on 12 Jul 2009, 06:36 AM
Hello Svetlina,
I don't quite get what you suggest.
I have tried to add overflow:none and remove Scrolling=None from the splitter itself. That did solve my problem but created another one. Actually I have added the Scrolling=None under you advice : http://www.telerik.com/community/forums/aspnet-ajax/splitter/scrolling-problem-with-radsplitter.aspx.
If you mean I should add the overflow:none in addition to the Scrolling=None, Then it doesn't solve my problem at all.
Please try to reproduce my case again. If you want to see the bug more clearly, use the zoom-in feature of explorer to magnify the area.
We have based a major web app on the splitter, and is currently unusable because when a user collapses the side pane, it moves to this hidden area. since the radSplitBar itself is all about 4px, substraction of 1 or 2 pixels from it makes clicking it impossible.
I am looking forward to you reply,
Elad.
I don't quite get what you suggest.
I have tried to add overflow:none and remove Scrolling=None from the splitter itself. That did solve my problem but created another one. Actually I have added the Scrolling=None under you advice : http://www.telerik.com/community/forums/aspnet-ajax/splitter/scrolling-problem-with-radsplitter.aspx.
If you mean I should add the overflow:none in addition to the Scrolling=None, Then it doesn't solve my problem at all.
Please try to reproduce my case again. If you want to see the bug more clearly, use the zoom-in feature of explorer to magnify the area.
We have based a major web app on the splitter, and is currently unusable because when a user collapses the side pane, it moves to this hidden area. since the radSplitBar itself is all about 4px, substraction of 1 or 2 pixels from it makes clicking it impossible.
I am looking forward to you reply,
Elad.
0
Elad
Top achievements
Rank 1
Rank 1
answered on 12 Jul 2009, 08:12 AM
Hello Sevetlina!
We have just upgraded to 2009 Q2 and indeed the problem seems to be fixed.
Thank you for your kind help.
We have just upgraded to 2009 Q2 and indeed the problem seems to be fixed.
Thank you for your kind help.
0
Hello Elad,
I am glad the new build solved the problem. In case you experience any further problems, do not hesitate to ciontact us again.
Sincerely yours,
Svetlina
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.
I am glad the new build solved the problem. In case you experience any further problems, do not hesitate to ciontact us again.
Sincerely yours,
Svetlina
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Check out the tips for optimizing your support resource searches.