Welcome Guest Search | Active Topics | Sign In | Register

Essential Objects Product Support Forum » All Products » Support » Tabstrip inside scrollable div

Tabstrip inside scrollable div Options
Previous Topic · Next Topic
Samuele
Posted: Wednesday, December 10, 2008 12:48:09 AM
Rank: Advanced Member
Groups: Member

Joined: 5/31/2007
Posts: 58
Hi,

try the follow code and scroll the horizontal bar.. the not selected tabs not scroll.

Code: HTML/ASPX 
<body>
    <form id="form1" runat="server">
        <div style="width: 300px; height: 300px; overflow:auto">
            <eo:TabStrip ID="TabStrip1" runat="server" ControlSkinID="None" MultiPageID="MultiPage1">
                <LookItems>
                    <eo:TabItem Height="21" ItemID="_Default" HoverStyle-CssText="position: relative; top: 2px; background-image: url(00010402); background-repeat: repeat-x"
                        Text-Padding-Top="1" Text-Padding-Bottom="2" RightIcon-HoverUrl="00010407" RightIcon-SelectedUrl="00010409"
                        RightIcon-Url="00010405" LeftIcon-HoverUrl="00010406" LeftIcon-SelectedUrl="00010408"
                        LeftIcon-Url="00010404" NormalStyle-CssText="position: relative; top: 2px; background-image: url(00010401); background-repeat: repeat-x"
                        SelectedStyle-CssText="background-image: url(00010403); background-repeat: repeat-x">
                        <SubGroup Style-CssText="background-image:url(00010410);background-position-y:bottom;background-repeat:repeat-x;color:black;cursor:hand;font-family:'Microsoft Sans Serif',Verdana;font-size:8.25pt;"
                            ItemSpacing="1">
                        </SubGroup>
                    </eo:TabItem>
                </LookItems>
                <TopGroup>
                    <Items>
                        <eo:TabItem Text-Html="Themes">
                        </eo:TabItem>
                        <eo:TabItem Text-Html="Desktop">
                        </eo:TabItem>
                        <eo:TabItem Text-Html="Screen Saver">
                        </eo:TabItem>
                    </Items>
                </TopGroup>
            </eo:TabStrip>
            <eo:MultiPage ID="MultiPage1" runat="server" Height="180px" Width="500px">
                <eo:PageView ID="PageView1" runat="server" Width="100%">
                    Tab 1</eo:PageView>
                <eo:PageView ID="PageView2" runat="server" Width="100%">
                    Tab 2</eo:PageView>
                <eo:PageView ID="PageView3" runat="server" Width="100%">
                    Tab 3</eo:PageView>
            </eo:MultiPage>
        </div>
    </form>
</body>


Thanks
Paroca
Back to top
 
eo_support
Posted: Wednesday, December 10, 2008 11:59:45 AM
Rank: Administration
Groups: Administration

Joined: 5/27/2007
Posts: 24,088
Hi,

Try to add position:relative to the div. For example:

Code: HTML/ASPX 
<div 
style="width: 300px; height: 300px; overflow:auto;position:relative;">

   ...TabStrip here....

</div>


That should resolve the issue.

Thanks!
Back to top
 


You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.