Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
65
Really frustrated with this control
posted

I am getting really frustrated with the WebTab control. I am trying to figure out what crazy logic you are using to resize the control but I can't figure it out.

The control seems to be resizing itself and even when I try and specify heights for the various pieces of the control in a style sheet or in javascript it seems to get overridden. Is there any way to turn this off?

As an example:

<div id="container">
   <ig:WebTab ID="mainTab" runat="server"></ig:WebTab>
</div>

My CSS:

#container { height: 600px; }
#mainTab { height: 100%; } // this should be 100% of the containing control which is 600px

When I load the page it appears the control changed its height to 623px instead of 600.

What changed this? I created a button that changes it via javascript when I click a button and it changes it right back.

What are you doing to change this and how can I stop this from happening. I have set the AutoSize property of the and it changes the behavior slightly...but it still seems to be resizing things and I do not want it to do that.

  • 24497
    posted

    Hi,

    I tested following and height of WebTab took height of its container. Heights of WebTab, red-container and blue-test-div had same height.

    <style type="text/css">
    #container { height: 600px; }
    #mainTab { height: 100%; }
    </style>
        <div id="container" style="background:red;">
        <ig:WebTab ID="mainTab" runat="server">
       <Tabs>
        <ig:ContentTabItem runat="server" Text="Tab 1">
        </ig:ContentTabItem>
        <ig:ContentTabItem runat="server" Text="Tab 2">
        </ig:ContentTabItem>
       </Tabs>
       </ig:WebTab>
        </div>
        <div style="position:absolute;top:10px;left:300px;height:600px;width:10px;background:blue;"></div>

    Note: if autoresize feature is enabled, then the bounds of WebTab are defined by the size of content in tab-item. Same happens to height or width if corresponding property of control is not set.

    If autosize is enabled and application changes size of html element on client or using size-member method: webTab.setSize('200px', '300px'), then that may have effect, but if selection changed and selected tab does not fit in that size, then size of control will be increased. Because similar action conflicts with autosize behavior.