[Solved] Horizontal Scrollbar - Last Item Hidden on IE

[rdochert]

hi there,
i'm using the treeview control and working within a confined space of 250pixels width. so i want to show a horizontal scrollbar when the item descriptions are longer than the viewable area but i dont ever want a vertical scrollbar, i just want it to expand down the page.

all is going well using:

style

="overflow-y:hidden;"

(which works in both IE and Firefox). there is just one annoying little glitch. in IE, the horizontal scrollbar hides the last item in the treeview whilst, in Firefox, it works perfectly?

any ideas? let me know if you need screenshots and i will open a support ticket.

full treeview code follows:

<telerik:RadTreeView ID="RadTreeView1" runat="server" DataSourceID="sqlHelp"

DataValueField="edc_keyval" DataTextField="edc_title" DataFieldID="edc_keyval"

DataFieldParentID="edc_parent_keyval" width="230px"

style="overflow-y:hidden;"

OnClientContextMenuItemClicked="onClientContextMenuItemClicked"

OnClientContextMenuShowing="onClientContextMenuShowing">

<contextmenus>

<telerik:RadTreeViewContextMenu ID="ROOT" runat="server" Skin="Outlook">

<Items>

<telerik:RadMenuItem Text="View This Help File" ImageUrl="~/IMG/ICO/view.gif"

Value="VIEW" />

</Items>

</telerik:RadTreeViewContextMenu>

</contextmenus>

</telerik:RadTreeView>

[Atanas Korchev]

Hi rdochert,

This is due to how  Internet Explorer renders scrollbars - as part of the element content. You can apply "padding-bottom" as a workaround. However it would create some whitespace in FireFox. The solution would be to use IE specific CSS:

        <style type="text/css">
            /*Targetting IE6*/
            * html .TreeView
            {
                padding-bottom:20px;
            }

            /*Targetting IE7*/
            *+html .TreeView
            {
                padding-bottom:20px;
            }
        </style>
        <telerik:RadTreeView ID="RadTreeView1" Width="120" runat="server" CheckBoxes="True"
            TabIndex="1" style="overflow-y:hidden" CssClass="TreeView">

Regards,
Albert
the Telerik team

Instantly find answers to your questions at the new Telerik Support Center

[rdochert]

cool with that. the extra white space doesnt worry me.
cheers,
rob