Currently, I draw the borders and apply margin to an element within the k-pane. The best I can make things look is this: http://i.imgur.com/LUvaJff.png
I want the border outside the scrollbar. But I also want the scrollbar to be generated by the splitter and not defined by an element nested inside of it. Like this: http://i.imgur.com/PkpyfMe.png
Help/tips are appreciated.
2 Answers, 1 is accepted
Rank 1
So, attached is the current look. It does what I want it to except that the borders push the layout horizontally and vertically (as expected) and the overflow is clipped. Is there somewhere I could put some margin or padding to bring these clipped borders back within view? Or is there a different approach?
Thanks
The Splitter panes should not have margins, paddings and borders. This is a requirement by design, which ensures faster and easier size calculations and layout adjustment.
Adding elements in the DOM hierarchy between the Splitter element and the Pane elements will not produce the desired result, because the Splitter expects the children of its wrapper element to be pane elements, so it will simply change the pane elements.
In your case I can suggest you to disable pane scrolling and use scrollable <div>s as children of the panes. Since these <div>s will have borders (and possibly paddings), then simply setting 100% height will lead to content overflow. You will have to calculate their heights in each Splitter's layoutChange event. All Splitter panes have width and height set at all times, which will make your task easier.
Dimo
Telerik